题目
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();//2
getName();//4
Foo().getName();//1
getName();//1
new Foo.getName();//2
new Foo().getName();//3
new new Foo().getName();//3
分析
此题涉及的知识点众多,包括变量定义提升、this指针指向、运算符优先级、原型、继承、全局变量污染、对象属性及原型属性优先级等等。
先整体分析下题目都做了什么了
第一行
首先定义了一个Foo
的构造函数
第二行
给构造函数创建了一个getName
的静态属性存储了一个匿名函数
第三行
为Foo
的原型对象新创建了一个叫getName
的匿名函数
第四行
通过函数变量表达式创建了一个getName
的函数
第五行
通过函数声明创建了一个getName
的函数
Foo.getName()
Foo.getName
自然是访问Foo
函数上存储的静态属性 //2
getName()
直接调用 getName
函数。既然是直接调用那么就是访问当前上文作用域内的叫getName
的函数。题干中有两个叫做getName
的函数。一个是函数表达式,一个是函数声明,函数表达式还有var
变量提升,函数声明也是提前,所以如下:
var getName = function () { alert (4);};
function getName() { alert (5);}
///
var getName;
function getName() { alert (5);}
getName = function () { alert (4);};
函数声明覆盖了var getName
,然后getName = function () { alert (4);}
;再次覆盖函数声明,所以最终输出的是//4
Foo().getName()
先执行了Foo
函数,然后调用Foo
函数的返回值this
指向window
然后调用getName
函数。
Foo
函数的第一句 getName = function () { alert (1); }
,不是通过var
声明的在这里是全局变量,覆盖了上面getName = function () { alert (4);}
,将此变量的值赋值为 function(){alert(1)}
//1
getName()
直接调用getName
函数,相当于 window.getName()
,因为这个变量已经被Foo
函数执行时修改了 //1
new Foo.getName()
此处考察的是js的运算符优先级问题。
圆括号优先级最高20,成员访问(obj.xxx) 、 new带参(new fn()) 函数调用(foo())的优先级相同为19,执行顺序从左到右。new无参优先级为18(new fo) 所以如下:
new (Foo.getName) ();
所以实际上是调用Foo构造函数中的getName
函数 //2
new Foo().getName()
(new Foo()).getName();
实例化Foo
,this
指向本身,本身构造函数中没有getName
属性,去找其原型对象中的getName
,//3
new new Foo().getName()
new ((new Foo()).getName)();
先初始化Foo
的实例化对象,然后将其原型上的getName
函数作为构造函数再次new
,//3