ES6对函数的拓展 — 箭头函数的this使用（2018-05-11）

  箭头函数中的this指向的是定义时的this，而不是执行时的this。

举个栗子

 //定义一个对象
    var obj = {        x:100, //属性x
        show(){        //延迟500毫秒，输出x的值
            setTimeout(               //匿名函数
               function(){console.log(this.x);},               500
           );
        }
    };
    obj.show();//打印结果：undefined

  上面对象中的方法(ES6对象的扩展),x的值确实是100，问题出在了this上，当代码执行到了setTimeout( )的时候，此时的this已经变成了window对象（setTimeout( )是window对象的方法），已经不再是obj对象了，ES5中可以用var that = this的方式避免。

箭头函数闪亮登场

//定义一个对象
    var obj = {        x:100,//属性x
        show(){            //延迟500毫秒，输出x的值
            setTimeout(               //不同处：箭头函数
               () => { console.log(this.x)},               500
            );
        }
    };
    obj.show();//打印结果：100

  唯一的不用就是setTimeout中，原本的匿名函数用箭头函数代替了箭头函数中的this指向的是定义时的this，而不是执行时的this当定义obj的show( )方法的时候，我们在箭头函数编写this.x，此时的this是指的obj，所以this.x指的是obj.x。而在show()被调用的时候，this依然指向的是被定义时候所指向的对象，也就是obj对象，故打印出：100。

作者：a小磊_
链接：https://www.jianshu.com/p/be8f5ce4799b