理解this的指针问题,this===window?
最近,有人问我,下面这个怎么理解?为什么打印x.x=undefined,y.x=1;
其实,这个不难理解,这个主要就是就是this的指向问题。搞明白指向问题,就很容易理解了。
(如果不懂构造函数的话,也可以把这里的函数简单地理解成普通函数或者方法;)
首先构造函数没实例化过,直接调用构造函数,那么我们来看一下:
function pointer(a,b){
console.log(this);
this.x=a;
this.y=b;
return this;
}
pointer();
结果:
从打印结果,我们就看出来了,this指向的是window;
为了更好地看明白和理解,我们把原来的题目稍微改一下:
function pointer(a,b){
this.x=a;
this.y=b;
return this;
}
var x=pointer(1,2);
var y=pointer(3,4);
console.log(x.x);//undefined
console.log(y.x);//3
依次打印的是undefined和3;
为什么呢?
第一次:
执行var x=pointer(1,2)的时候,因为构造函数里面有return this;所以x=window;那this.x=a和this.y=b;变成了window.x=1和window.y=2;
第二次:
执行var y=pointer(3,4)的时候,因为构造函数里面有return this;所以y=window;那this.x=a和this.y=b;变成了window.x=3和window.y=4;
所以,第二次重新赋值了window.x和window.y;第二次之后的是不是window.x=3和window.y=4了?;
所以就明白了console.log(y.x);为什么打印的是3了;
那么console.log(x.x)为什么打印的是undefined呢?我们继续:
大家上面理解起来没问题吧,没问题我就继续:
另外看下面这两句代码
var x;
console.log(x===window.x);
打印结果:
那么,明白定义全局变量var的原理了吗,var x===window.x,就相当于在当前作用域下加上属性;
所以,第二次之后window.x=3,就相当于var x=3了,那么x 的值改变了,x等于3,不再是等于引用window了,所以是不是x.x就等于undefined了,明白了吧。
到这里,可能还会有人问this.x=a; this.y=b;这两个不是一样吗,x.x等于undefined,那y.x不也是等于undefined吗?当然,问的也没有错,但是呢,是不是他们后面还有一句return this;调用的最后,返回window,那么y===window,而window.x是不是等于3?所以y.x就等于3而不是undefined了呀!
上面我有什么说得不对的地方,还请各位大佬多多指正;指引指引我一下,非常感谢!
你的粉丝__啊德
发自手记
共同学习,写下你的评论
评论加载中...
作者其他优质文章