js经典面试题01

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();
getName();
Foo().getName();
getName();
new Foo.getName();
new Foo().getName();
new new Foo().getName();

---

由于经常有人拿这个面试提问所以整理了一下保存起来

解析：

1、Foo.getName(); //2

Foo是一个函数，也可以说是一个对象，所以它也可以挂载一些属性和方法。
所以结果执行的是Foo对象的一个叫做getName()的属性，而1、4、5中的getName都是作为函数存在，所以可以排除1、4、5

剩下两个中，2是Foo对象自身的属性，3是Foo对象原型链上的属性，而自身属性的优先级高于原型链上的属性，所以执行结果是2

---

2、getName(); //4

结果执行的是getName函数，而题目代码中有3个相关函数，分别是1、4、5

1中的getName是定义在Foo函数中的函数，由于Foo尚未执行，因此它没有暴露出来，无法被外部调用，可以排除

4和5都可以被正常调用，关键在调用先后问题

由于5是普通函数（优先级最高），4是匿名函数；js解析时会将5提前至最上方优先解析，而后面解析的4会将5覆盖，所以执行结果是4

---

3、Foo().getName(); //1

结果执行的是Foo函数，Foo函数中有个返回值是this；this被普通函数调用后，指向的对象一定是window对象，所以此处的结果已经可以解析为window.getName()，即调用getName()函数，所以最后执行的就是window.getName，所以输出1；

---

4、getName(); //1

在上面已经更改全局的getName，执行getName即是执行window.getName；所以依然是1

---

5、new Foo.getName(); //2

new 操作符在实例化构造器的时候，会执行构造器函数，也就是说，foo.getName会执行，输出2

---

6、new Foo().getName(); //3

new操作符的优先级较高，所以会先new foo()得到一个实例，然后再执行实例的getName方法,这个时候，实例的构造器里没有getName方法，就会执行构造器原型上的getName方法

---

7、new new Foo().getName(); //3

先执行new foo()得到一个实例，然后在new 这个实例的getName方法,这个时候会执行这个方法，所以输出3

---