一道超级复杂的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();

怎么样?是不是有点糊涂了。

首先要明确下面一些基本知识:

1、 this的指向只取决于调用的方式,,函数定义里面的this指向全局的window

new的过程:新建对象,让this指向它,返回this

普通的函数调用时得到的值是return的返回值,new 得到值可能是this也有可能是return 的值,这取决于return后面数据的类型。

2、实例化对象访问一个属性的顺序,先看自身有没有这个属性,再看访问原型里的。
3、new 后面跟的是一个构造函数,则会创建一个对象。如果是一个构造函数的属性名称,那么没有任何作用。

new 只会和离他最近的()结合

请看下面的一张图:
在这里插入图片描述
一开始Foo.getName()1,第5行代码将它修改为2,所以Foo.getName()的输出为2

getName() 是全局调用,函数提升优先于变量提升,到了第7行代码getName()被修改为4,所以输出为4

Foo()是函数调用,得到的是return后面的值thisthis指向window,并且第2行代码将getName()修改为1,所以结果为1

同理,getName()的输出也是为1

new Foo.getName() new没有任何作用,这里是方法调用,输出值为2

new Foo().getName() new和最近的一个()结合,所以得到了一个实例化对象,实例化对象自身没有getName这个属性,所以访问原型里面的getName,为 3

new new Foo().getName() 最前面的new没有任何意义,同上一个

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值