本文主要讲述在ES6背景下,箭头函数的this指向问题
箭头函数作用域内是没有this指针的,如果在箭头函数里面使用this,则该this继续指向该箭头函数外部执行上下文的this。
用以下案例简单说明一下:
this.hobby = '游泳';
const obj = {
hobby: "敲代码",
func: () => {
console.log(this.hobby)
}
};
obj.func()
// 对象的方式调用,func的执行上下文与obj一样,如果func是箭头函数,则func里面的this指针指向func执行上下文的外部(即obj的外部),此处指向的是window
// 输出 游泳
const obj1 = {
hobby: "学习",
func: function () {
const func1 = () => {
console.log(this.hobby)
};
//此步默认在调用外部的func的情况下会返回func1并且执行调用
return func1()
}
};
obj1.func() //对象方式调用, func1的执行上下文为func,即func1的外部执行上下文为func,this指向为func,同样也指向与func同级的obj1
//输出 学习
通过以上案例说明:
1.在对象方法当中,如果方法的类型为箭头函数,则通过对象直接调用的话箭头函数内的this指针不是指向该对象本身,而是指向更外层的window。
2.如果该箭头函数嵌套在普通函数当中,而该普通函数通过对象方法的形式存在于对象中并调用,则箭头函数内部的this指针会指向该对象。
Comments | NOTHING