今天看到一篇专门讲解this对象的文章,感觉真是醍醐灌顶,对于this的理解更加深刻了。非常感谢作者的分享!
传送门:https://blog.csdn.net/dwb123456123456/article/details/85071301
接下来我对该文章内容进行总结,方便自己日后的知识整理和复习。
首先是对函数的分析
这一部分是让我大开眼界的。按照以前的理解以一下形式运行函数不应该是最常见的吗?
func(a,b)
但是文章中提到,这其实是一种语法糖
真正的调用是通过call()方法实现的。以前我一直在想,作为一个函数,为什么会有两个方法呢(call和apply)?而且他们还不是继承的!
但是这样一来就好理解了,这两个方法正式函数调用的根本,这样就很好理解他们的存在了。
接着就是this对象的出场了
根据call()的格式
func.call(context,a,b)
可以看出,调用函数的即是context对象,这个context对象不就是this对象吗?
所以使用对象调用方法this指向对象就非常好理解了。
然后直接使用函数的时候,context是null,那么要明确一个原理如果你传的 context 就 null 或者 undefined,那么 window 对象就是默认的 context(严格模式下默认 context 是 undefined)
所以我们可以总结一下:
this的指向其实就是call()方法中的context,当有对象调用时,该对象就是context,当没有是context就默认为是window
那么对于嵌套的情况呢?
a={
name:1,
b:{
name:2,
c(){
console.log(this.name);
}
}
}
a.b.c()
很好理解,输出的是2,因为代码可以这样等化:
a.b.c.call(b);
那么如果将函数放数组中this又指向什么呢?接下来的思路就更妙了!
function func(){
console.log(this===arr);
}
let arr = [func];
arr[0]();
以下情况下输出的是true,怎么理解呢?既然对象中的方法是通过obj.func访问的(用属性名访问),数组是通过下标访问的,那么我们就可以看成arr.0(),然后转化成arr.0.call(arr),所以this指向就是arr。(真牛)。
最后介绍了this的四种用法:
1.作为构造函数调用,this 指代new 出的对象(已经理解)
2.在一般函数方法中使用 this 指代全局对象(就是不经过对象调用)
3.作为对象方法调用,this 指代上级对象
4.apply和call()一样,就是所有参数放一个数组里传进去(push()可以通过apply直接传个数组进去)
最后就是箭头函数了,箭头函数没有this对象,所以该this来自外部的this(往外面找,自由变量的感觉)。