箭头函数和普通函数的区别

面试时被问到箭头函数和普通函数的区别。。。

-_-||

借用别人的一个栗子：

function make () {
  return ()=>{
    console.log(this);
  }
}
var testFunc = make.call({ name:'foo' });
testFunc(); 
testFunc.call({ name:'bar' }); 

Object {name: "foo"}
Object {name: "foo"}

可以看到箭头函数在定义之后，this 就不会发生改变了，无论用什么样的方式调用它，this 都不会改变；

原因：箭头函数不会自动绑定局部变量，如this，arguments，super(ES6)，new.target(ES6)等

所以箭头函数没有它自己的this值，箭头函数内的this值继承自外围作用域。在箭头函数中调用 this 时，仅仅是简单的沿着作用域链向上寻找，找到最近的一个 this 拿来使用

{
      ...
      addAll: function addAll(pieces) {
        var self = this;
        _.each(pieces, function (piece) {
          self.add(piece);
        });
      },
      ...
    }

在这里，你希望在内层函数里写的是this.add(piece)，不幸的是，内层函数并未从外层函数继承this的值。在内层函数里，this会是window或undefined，临时变量self用来将外部的this值导入内部函数。（另一种方式是在内部函数上执行.bind(this)，两种方法都不甚美观。）这时候就可以使用箭头函数来达到要求