介绍

箭头函数表达式的语法比函数表达式更简洁，并且没有自己的 this、arguments、super 和 new.target。箭头函数更适用于本来应该需要匿名函数的地方，并且它们不能用作构造函数。

因为箭头函数没有 prototype，所以箭头函数本身没有 this。

注意事项

ES6 使用箭头函数

使用箭头函数有两个好处:

代码更加简洁

静态绑定this 箭头函数中，this指向的是定义箭头函数的对象中的this。

    var name = 'outer'
    var obj = {
        name: 'inner',
        func: () => {
// 当前 this 指向
            console.log(this.name)
        }
    }
    var obj2 = {
        name: 'inner',
        func: function () {
            console.log(this.name)
        }
    }
    obj.func()
   // "outer"  
    obj2.func() 
    // "inner

• 第一个使用了箭头函数，由于箭头函数的this与其所在环境中的this相同，也就是与obj的this相同，
• 而obj处于全局环境的活动对象中，this指向全局对象，这里指window，所以输出outer。
• 注意:obj对象的this与它的属性中的this不一样。
• 第二个使用了寻常函数，作为obj2的一个属性，func方法中的this指向了所在的对象。输出inner。

1. 返回对象

const foo = () => ({ bar: 'baz' });

由于大括号会被解释为代码块，所以利用箭头函数直接返回一个对象时，需要用小括号包裹。

2. 禁止构造函数

const Foo = () => {};
const foo = new Foo(); // TypeError: Foo is not a constructor

3. 对象方法

const foo = {
  bar: 'baz',
  baz: () => this.bar = 'foo'
}

foo.baz(); // foo.bar: 'baz' window.bar: 'foo'

箭头函数会继承父级作用域的 this，而对象没有作用域，此时 this 指向全局作用域（window）。

日常使用

1. 闭包

const add = (i = 0) => {return () => ++i};
const increase = add();
increase(); // 1
increase(); // 2