Es6箭头函数的作用

（1）简明的语法如下：

const numbers=[1,2,3,4,5];

const double=numbers.map(function(number){
return number*2

})

console.log(double);

//[2, 4, 6, 8, 10]

使用箭头函数改写：

let numbers1=[1,2,3,4,5];

let double1=numbers.map((number)=>{
return number*2

})

console.log(double1);

//[2, 4, 6, 8, 10]

注意箭头函数的语法是去掉之前的function,没有参数或者多个参数时需要加括号()，多个参数时使用逗号分隔，一个参数时括号可以省略。

（2）隐士返回，如 下面的代码可以去掉return,代码移到一行，减少代码量。

let numbers1=[1,2,3,4,5];

let double1=numbers.map((number)=>number*2)

console.log(double1);

//[2, 4, 6, 8, 10]

（3）解决了this的指向问题，原生的写法this指向的是调用者，箭头函数this绑定的是定义时的那个对象。

箭头函数的this绑定看的是this所在的函数定义在哪个对象下，绑定到哪个对象则this就指向哪个对象
如果有对象嵌套的情况，则this绑定到最近的一层对象上

//定义一个对象

var obj = {
x:100,

//属性x

show(){
//延迟500毫秒，输出x的值

setTimeout( //匿名函数 function(){console.log(this.x);}, 500 );

}

};

obj.show();//打印结果：undefined

为什么结果打印是undefined呢，问题出在了this上，当代码执行到了setTimeout( )的时候，此时的this已经变成了window对象（setTimeout( )是window对象的方法），已经不再是obj对象了，所以我们用this.x获取的时候，获取的不是obj.x的值，而是window.x的值，再加上window上没有定义属性x，所以得到的结果就是：undefined。

如果使用箭头函数来编写同样的一段代码，得到的this.x又是另一番景象。我们来试试看：

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

当定义obj的show( )方法的时候，我们在箭头函数编写this.x，此时的this是指的obj，所以this.x指的是obj.x。而在show()被调用的时候，this依然指向的是被定义时候所指向的对象，也就是obj对象，故打印出：100。

那么总结下什么时候我们不能使用箭头函数：

（1）做为构造函数的时候不能使用箭头函数

（2）真正需要this的时候如给元素绑定click事件的 时候，执行的回调函数不能使用箭头函数。

（3）我们需要使用arguments对象的时候不能使箭头函数。箭头函数中没有arguments对象。