前端面试题目，求解答

Question

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(); 

如题，求大神解答,希望可以把原因写得很详细。

Answer 1

这样题目只能作为面试，生产环境没有这么写的。当调用这个 Foo() 的时候，getName 成为全局变量，不使用 var 这样的在严格模式是不允许的，另外在严格模式下函数内的this指向undefined的，非严格模式下就成了windowfunction  Foo() {        getName =   function () {                 console.log(1);     };        return  this; }var  getName =   function () {         console.log(4); }; function  getName() {         console.log(5); }这个就相当于// 函数表达式提升比Function声明提升少一级 function  getName() {         console.log(5); } // 这里就会重写了 var getName; getName =  function () {         console.log(4); };

Answer 2

JS在执行之前有一个编译阶段，在编译阶段主要：一、初始化用var定义的变量为undefined；二、初始化function定义的函数。注意：两种定义函数的方式在编译阶段初始化的结果是完全不同的，比如：var greet = function(){}; // `greet` 初始化为 `undefined`// 而function greet(){} // `greet` 初始化为 函数结合你的例子，实际上根据编译及执行的过程，可以将代码的顺序调整为：// 定义 1function Foo() {  // 定义 7  getName = function() {    console.log(1);  };  return this;}// 定义 2var getName = undefined;// 定义 3function getName() {  console.log(5);}// 定义 4Foo.getName = function() {  console.log(2);};// 定义 5Foo.prototype.getName = function() {  console.log(3);};// 定义 6getName = function() {  console.log(4);};//请写出以下输出结果：Foo.getName(); // 2 [定义 4]getName(); // 4 [定义 6]Foo().getName(); // 1 `Foo()`做了两件事：// 一：将`getName`从[定义 6]改变为[定义 7]// 二：`return this`, `this`此时为`window`// 所以`Foo().getName()`相当于`window.getName()`相当于`getName()`（注意，此时getName为[定义 7]）getName(); // 1 理由见上new Foo.getName(); // 2 `new Foo.getName()`相当于`new (Foo.getName)()`, // 而不是`(new Foo).getName()`, 这条语句将[定义 4]作为构造函数并执行new Foo().getName(); // 3 `new Foo().getName()`相当于`(new Foo()).getName()`, // 而不是`(new Foo().getName)()`, 这条语句执行了[定义 5]new new Foo().getName();// 3 `new new Foo().getName()`相当于`new (new Foo().getName)()`, // 这条语句将[定义 5]作为构造函数并执行