箭头函数this指向
作者:互联网
公理:
箭头函数的this在定义时就确定了,不会再改变
鉴于网上的各种对this的解释我记不住,记住了也常有和实践不符的情况,我自己形成一套找this的方法,可能与理论不符合,但是目前能够解释我实践的结果
我的歪理
- 箭头函数的 this 是定义该函数的层级 的父层级的this
{
b
{
a
}
}
a层的父层是b所在的那层
- 什么叫定义:
obj.fun = () => {}
这不行,必须得是let,const,var fun = () => {}
这才叫我说的定义,如果没有let/const/var那就往外找,直到找到 - 被定义在哪个层级,不看我在哪个
{ }
里,就认let const var,自己有说明自己所在的层级就是这个{ }
里,自己没有就往外找;外面谁有,那它在哪个层级我就在哪个层级
const a = () => {} 这叫自己有,obj.a = () => {} 这叫自己没有
let obj = {
area1: {
this1() {
const f = () => { //这是正儿八经的const定义 f 就在 this1 里面(定义f的层级的父层级就是this1),此处打印的this就是this1的this
console.log('this1: ', this)
}
obj.area1.area2.this2_2 = f
},
与下面这个作比较
this1: () => { //这可不叫定义,一直往外找l/c/v 发现let obj,obj的父层级的this就是此处this1的this(别的不认,就认let/const/var)
const f = () => { //我定义在this1里,外层是this1,this1 的this 指向window,我的 this 也指向window
console.log('this1: ', this)
}
},
area2: {
this2() {
const f = () => {//这也是正儿八经的const定义,父层就是this2,我打印的this和直接在this2里打印的this是同一个,this2直接打印的this是area2,所以我的this也是指向area2
console.log('area2 > f: ', this)
}
f()
}
}
}
}
obj.area1.area2.this2_2() //箭头函数的this在定义时就确定且不能改,所以我打印的this指向area1
标签:层级,const,函数,指向,this1,箭头,obj,area2,定义 来源: https://www.cnblogs.com/Lilc20201212/p/16398945.html