圖片來自簡書

es6全家桶（二）—— rest參數(shù)、箭頭函數(shù)

箭頭函數(shù)

ES6 允許使用“箭頭”（=>）定義函數(shù)。

var f = v => v;
上面的箭頭函數(shù)等同于：
var f = function(v) { return v; };

箭頭函數(shù)的一個用處是簡化回調(diào)函數(shù)。

// 正常函數(shù)寫法
[1,2,3].map(function (x) {
  return x * x;
});

// 箭頭函數(shù)寫法
[1,2,3].map(x => x * x);

下面是 rest 參數(shù)與箭頭函數(shù)結(jié)合的例子。

const numbers = (...nums) => nums;
numbers(1, 2, 3, 4, 5)
// [1,2,3,4,5]

const headAndTail = (head, ...tail) => [head, tail];
headAndTail(1, 2, 3, 4, 5)
// [1,[2,3,4,5]]
```

箭頭函數(shù)有幾個使用注意點。

（1）函數(shù)體內(nèi)的this對象，就是定義時所在的對象，而不是使用時所在的對象。

（2）不可以當作構(gòu)造函數(shù)，也就是說，不可以使用new命令，否則會拋出一個錯誤。

（3）不可以使用arguments對象，該對象在函數(shù)體內(nèi)不存在。如果要用，可以用 rest 參數(shù)代替。

（4）不可以使用yield命令，因此箭頭函數(shù)不能用作 Generator 函數(shù)。

舉例：請問下面的代碼之中有幾個this？
``` javascript
function foo() {
  return () => {
    return () => {
      return () => {
        console.log('id:', this.id);
      };
    };
  };
}

var f = foo.call({id: 1});

var t1 = f.call({id: 2})()(); // id: 1
var t2 = f().call({id: 3})(); // id: 1
var t3 = f()().call({id: 4}); // id: 1
```
上面代碼之中，只有一個this，就是函數(shù)foo的this，所以t1、t2、t3都輸出同樣的結(jié)果。

因為所有的內(nèi)層函數(shù)都是箭頭函數(shù)，都沒有自己的this，它們的this其實都是最外層foo函數(shù)的this。
除了this，以下三個變量在箭頭函數(shù)之中也是不存在的，指向外層函數(shù)的對應(yīng)變量：arguments、super、new.target。
由于箭頭函數(shù)沒有自己的this，所以當然也就不能用call()、apply()、bind()這些方法去改變this的指向。


```