在学习javascript中遇到的问题

最新推荐文章于 2022-08-09 21:19:07 发布

原创最新推荐文章于 2022-08-09 21:19:07 发布 · 1.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #函数声明 #预编译

前端JavaScript 专栏收录该内容

1 篇文章

订阅专栏

最近开始打算好好学习前端知识，从前端知识攻克。在一个前端群中见到了这样一个题，自己没有回答正确，特别来记下来，总结经验。

代码如下：

function 
Foo(){
getName =
function(){
console.log(1);
};
return this;
}
Foo.getName =
function(){
console.log(2);
};
Foo.prototype.getName
= function(){
console.log(3);
};
var 
getName = function(){
console.log(4);
};
function 
getName(){
console.log(5);
}

Foo.getName();//2
getName();//4
Foo().getName();//1
getName();//1
new Foo.getName();//2
new Foo().getName();//3
new new
Foo().getName();//3

getName()执行的时候存在预编译的概念，在腾讯课堂中渡一教育的JavaScript教程就讲的很细，大家可以去看看，说多了像打广告，就不多说了。

function getName(){}这是函数声明，在预编译时会被提到最前面执行。然后在执行到var getName = function(){}的时候，实际只是执行了函数赋值，就是定义getName也是在预编译的时候提到最前面执行了。所以此时getName（）这个函数的内容是console.log(4)。

执行Foo()时，使用console.log(Foo())它输出的是Window，也就是说它返回的this是全局的，所以这时getName()是存在全局中的，Foo()里面的getName（）就把getName（）进行了更改，后面再执行getName()是输出的就是1了。

Foo.getName()是一个函数，使用new 函数会生成一个对象，这个对象的构造函数是Foo.getName()。

new new Foo().getName()我的理解是先执行new Foo()生成一个对象，然后去使用该对象的getName()方法作为构造函数，再new一个对象。