ES6 箭头函数this指向

普通函数this的指向

普通函数this的指向是,在调用函数时所在的对象

 var x=11;
var obj={
    x:22,
    y : function (){
        return function say(){
            console.log(this.x);
        }
    }
}
obj.y()();      //输出11,即this指向的是全局对象

上述就是在全局作用域中调用函数,所以this对象指向全局对象
即使有很多层作用域

 x=11;
var obj={
    x:22,
    y : function (){
        return function say(){
            console.log(this.x);
        }
    }
}

var aa = {
    x: 5,
    say : function () {
       obj.y()();
    }
}
aa.say();   //输出11

箭头函数this的指向

下面代码执行环境的全局对象是window,如果在global中会有一些差别。

  • 箭头函数没有自己的this, 它的this是继承而来,所以箭头函数不可以当作构造函数
  • 箭头函数体内的this对象是指向定义时所在的作用域,而不是调用时所在的作用域
var x=11;
var obj={
    x:22,
    y : function (){
        return say=()=>{
            console.log(this.x);
        }
    }
}
obj.y()();     //输出22

通俗来说,因为箭头函数实质没有this,所以箭头函数的this就是它所在的词法作用域中的this。如今,第一个箭头函数就在y()中。因此,它的this就是y()的this。根据this的默认绑定原则,此时谁调用了y(),y()中的this就指向谁,因此既然是obj调用了this,那么y()的this就是obj,所以箭头函数的this就是obj。如果不懂还可以看下面的例子

var x=11;
var obj={
    x:22,
    say : ()=>{
            console.log(this.x);
        }
    };

obj.say();    //输出11  如果在global为全局对象中则输出的是undefined

这里的say()箭头函数在obj对象的作用域中,所以箭头函数this就是obj中的this,而obj所在地执行环境是window,即window调用了obj,所以this对象就指向的window。

箭头函数还可以让setTimeout里面的this,绑定定义时所在的作用域,而不是运行时所在的作用域。

ps:这里只是个人的一点小理解,欢迎各位大神能给出意见。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 定义箭头函数中的this 定义函数的this对比 自己看 ``` var addr = {} ```
    苹果_7726阅读 269评论 0 0
  • 函数参数的默认值 基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。 上面代码检查函数l...
    呼呼哥阅读 3,476评论 0 1
  • 1.函数参数的默认值 (1).基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。
    赵然228阅读 707评论 0 0
  • 函数和对象 1、函数 1.1 函数概述 函数对于任何一门语言来说都是核心的概念。通过函数可以封装任意多条语句,而且...
    道无虚阅读 4,664评论 0 5
  • 人生若白驹过隙 忽然而已 天气不错的时候 去了奶奶家的老院子里 搬了凳子在外面晒太阳 我也渴望有个院子 只是春天的...
    健忘的喵小姐阅读 556评论 0 2