有意思的一道js题目（原型相关）

题目如下：

function Foo() {
    getName = function () { alert (1); };
    return this;
}
Foo.getName = function () { alert (2);};
Foo.prototype.getName = function () { alert (3);};
var getName = function () { alert (4);};
function getName() { alert (5);}
 
//请写出以下输出结果：
Foo.getName();
getName();
Foo().getName();
getName();
new Foo.getName();
new Foo().getName();
new new Foo().getName();

首先分析一下题目

getName分别以变量，和函数变量的形式声明，涉及到变量声明提升。因此实际执行是

function Foo() {
    getName = function () { alert (1); };
    return this;
}
var getName;//只提升变量声明
function getName() { alert (5);}//覆盖var的声明
Foo.getName = function () { alert (2);};
Foo.prototype.getName = function () { alert (3);};
getName = function () { alert (4);};

第一问

Foo.getName(); 自然是访问Foo函数上存储的静态属性//2

第二问

getName();也可由以上分析易得4;

第三问

Foo().getName();先执行Foo()函数，然后调用Foo函数的返回值对象的getName属性函数。
执行Foo()函数返回this,这里是window，也就等于window.getName();然后Foo()执行过程中getName没有var声明，是全局变量，因此也就修改了先前的getName函数，此时代码可认为是

function Foo() {
        getName = function () { alert (1); };
        return this;
    }
var getName;//只提升变量声明
function getName() { alert (5);}//覆盖var的声明
Foo.getName = function () { alert (2);};
Foo.prototype.getName = function () { alert (3);};
getName=function(){alert(1);}//覆盖上文getName定义

所以输出1;

第四问

getName();和上一问一样,直接输出1;

第五问

new Foo.getName();后面几问考察到js运算符优先级。
详细优先级汇总表点击这里

部分优先级

上图优先级从高到低排列;.优先级高于new,这里的new我认为是无参的，因此优先级最低。
所以是new ((Foo.getName)())
也就是把Foo.getName()函数作为了构造函数来执行。

第六问

new Foo().getName()

//?此时的点不是成员访问运算了么，作者说等于(new Foo()).getName()

先执行new Foo()

构造函数的返回值

分三种情况：

• 没有返回值，返回实例化对象。

    function Foo(){};
    >undefined;
    new Foo()
    >Foo {}

• 若有返回值检查其返回值是否为引用类型。如果是非引用类型，如基本类型（string、number、boolean、null、undefind）则与无返回值相同，返回实例化对象。

    function Fn(){return true}
    >undefined
    new Fn()
    >Fn {}

• 若返回值是引用类型，则实际返回值为这个引用类型。

    function fn(){return {a:1}}
    >undefined
    new fn()
    >Object {a: 1}

this不能当做引用类型

回到题目，new Foo().getName() ，原题中返回this,代表当前实例化对象,然后调用实例化对象的getName(),//3

第七问

new new Foo().getName();

最终等于new ((new Foo()).getName)();

//这里的顺序也是一个问题

先初始化Foo的实例化对象，将其原型上的getName作为构造函数再次new，还是3.

总结

对于后面几个问题来说，与其用优先级的知识来解释，还不如用（new 构造函数）更加通俗易懂。譬如 new Foo(),返回Foo函数的一个实例Foo{},然后总不能再new一个实例吧，所以只能等后边再结合成一个函数，就像第五问 new Foo.getName() ,Foo只是个函数名,而Foo.getName()是个函数。第六问new Foo().getName(),Foo()是一个函数，就直接new 了，然后返回Foo的实例Foo{},再找继承的getName()；第七问new new Foo().getName(),(new Foo())返回实例，所以再和后面的结合成一个函数，然后再new。不知道这样理解有多少问题，还请各位赐教~