码迷,mamicode.com
首页 > 其他好文 > 详细

ES6中的箭头函数

时间:2017-03-25 22:15:25      阅读:176      评论:0      收藏:0      [点我收藏+]

标签:int   prot   nbsp   tty   UI   key   comment   javascrip   param   

箭头函数内部没有constructor方法,也没有prototype,所以不支持new操作。但是它对this的处理与一般的普通函数不一样。箭头函数的 this 始终指向函数定义时的 this,而非执行时。我们通过一个例子来理解:

var o = {
    x : 1,
    func : function() { console.log(this.x) },
    test : function() {
        setTimeout(function() {
            this.func();
        }, 100);
    }
};

o.test(); // TypeError : this.func is not a function

如果把代码改成这样

var o = {
    x : 1,
    func : function() { console.log(this.x) },
    test : function() {
        var _this = this;
        setTimeout(function() {
            _this.func(); 
        }, 100);
    }
};

o.test();

 

通过使用外部事先保存的this就行了。这里就可以利用到箭头函数了箭头函数的 this 始终指向函数定义时的 this,而非执行时。所以我们将上面的代码修改如下:

var o = {
    x : 1,
    func : function() { console.log(this.x) },
    test : function() {
        setTimeout(() => { this.func() }, 100);
    }
};

o.test();

这回this就指向o了。

ES6中的箭头函数

标签:int   prot   nbsp   tty   UI   key   comment   javascrip   param   

原文地址:http://www.cnblogs.com/wawazhang/p/6618755.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!