javascript中箭头函数this指向问题


本文主要讲述在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指针会指向该对象。

声明:初心|版权所有,违者必究|如未注明,均为原创|本网站采用BY-NC-SA协议进行授权

转载:转载请注明原文链接 - javascript中箭头函数this指向问题


愿你勿忘初心,并从一而终