JavaScript中的普通函数和箭头函数的区别和用法详解

• 在箭头函数中调用 this 时，仅仅是简单的沿着作用域链向上寻找，找到最近的一个 this 拿来使用
  箭头函数在定义之后，this 就不会发生改变了，无论用什么样的方式调用它，this 都不会改变；

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

• 箭头函数中没有自动绑定的局部变量，包括：this，arguments，super(ES6)，new.target(ES6)……
  在普通函数中，会自动绑定上的各种局部变量，箭头函数都是十分单纯的沿着作用域链向上寻找……

function foo() {
  setTimeout( () => {
   console.log("args:", arguments);
  },100);
}
foo( 2, 4, 6, 8 );
// args: [2, 4, 6, 8]

//箭头函数中可以利用展开运算符来接收参数
const testFunc = (...args)=>{
  console.log(args) //数组形式输出参数
}

• 普通函数实现和箭头函数一样的效果

function make () {
  var self = this;
  return function () {
    console.log(self);
  }
}
//或者
function make () {
  return function () {
    console.log(this);
  }.bind(this);
}