箭头函数和常规函数的区别

1. this指向
   常规函数中的this指向是动态的，只有调用的时候才能确定。
   箭头函数没有自己的this，它指向的是外层函数的this。
2. 构造函数
   箭头函数不能使用使用new关键字作为构造函数。
3. arguments对象
   常规函数中arguments是一个类数组对象，包含了函数在执行时接收到的参数列表。
   箭头函数没有定义arguments关键字，它指向外层函数的arguments。
   如果你想获取箭头函数自己的参数对象，可以用 ES6 的扩展运算符

function myRegularFunction() {
  const myArrowFunction = (...args) => {    console.log(args);  }
  myArrowFunction('c', 'd');
}
myRegularFunction('a', 'b'); // { 0: 'c', 1: 'd' }

4. 隐式返回值
   常规函数中如果没有return语句返回值，会隐式的返回undefined。
   箭头函数除了可以用常规函数一样的方式返回值之外，还有一个独有的特性：如果箭头函数只包含一个表达式，那么就可以省略函数体的花括号和return语句，并且这个表达式会被当作返回值。

const increment = (num) => num + 1;
increment(41); // => 42

5. 成员方法
   如果是把常规函数作为类的成员方法，当把这个成员方法作为回调函数使用时，比如setTimeout()或者事件监听器，这个时候访问当前实例的this会出现问题

class Coder {
  constructor(nickName) {
    this.nickName = nickName;
  }
  logName() {    console.log(this.nickName);  }
}
const coder = new Coder('Kayson');
setTimeout(coder.logName, 1000);
// 1 秒后输出 "undefined"

定时器在1秒后执行实例的方法 logName，这个时候方法已经跟实例分离了，this不再是实例，而是全局对象，全局对象上没有nickName属性，因此输出undefined。
怎么办呢？可以用函数上的bind方法，指定函数的执行上下文为当前实例：

setTimeout(coder.logName.bind(coder), 1000);
// 1 秒后输出 "Kayson"

或者使用箭头函数作为成员方法

class Coder {
  constructor(nickName) {
    this.nickName= nickName;
  }
  logName = () => {    console.log(this.nickName);  }
}
const coder = new Coder('Kayson');
setTimeout(coder.logName, 1000);
// 1 秒后输出 "Kayson"