理解ES6 「箭頭」函數（=>）

ES6容許使用「箭頭」（=>）定義函數。

var f = v => v;

等同於：

var f = function(v) {
  return v;
};

若是箭頭函數不須要參數或須要多個參數，就使用一個圓括號表明參數部分。

var f = () => 5;
// 等同於
var f = function () { return 5 };


var sum = (num1, num2) => num1 + num2;
// 等同於
var sum = function(num1, num2) {
  return num1 + num2;
};

//若你想使用標準的函數體，或者函數體內可能有更多的語句要執行，則要用大括號將函數體括起來，並明肯定義返回值。
var sum = (num1, num2) => { return num1 + num2; }

//若是箭頭函數直接返回一個對象，必須在對象外面加上括號。
var getTempItem = id => ({ id: id, name: "Temp" });

//以上例子出處  https://www.cnblogs.com/huansky/p/5684867.html

至此，咱們已經理解怎麼用它了；那麼它跟普通的function定義函數最大的區別是什麼？

箭頭函數中的 this

箭頭函數 中的 this，指向的是它定義時所在的this；實際上，箭頭函數沒有本身的this；它的做用域是詞法做用域，會跟着做用域鏈找到最近的一個this引用；

var name = 456
var obj = {
        name:'123',
        fn:function () {
            console.log(this.name);//123 對象的屬性方法中的this 指向對象。
            setTimeout(function () {
                console.log(this.name)//456 匿名函數的 this 指向window。
            },1000);
            setTimeout(()=>{console.log(this.name)},2000);//123 找到this是指向obj的；
            obj.do(()=>{console.log(this)});//obj對象 找到定義時的this是指向obj的（即obj.fn 的this）；
        },
        do:function (fn) {
            fn();
        }
    };
    obj.fn();

匿名函數的 this 始終是指向window 的

var obj = {
          fn:function () {
            (function () {
                console.log(this); //window
            })();
            console.log(this); //obj
        }
    }
    obj.fn();

普通函數的this 能夠這樣歸納

（來自知乎）

函數執行時，this 老是指向調用該函數的對象，規則能夠簡單歸納以下：

1. 有對象就指向調用對象
2. 沒調用對象就指向全局對象
3. 用new構造就指向新對象
4. 經過 apply 或 call 或 bind 能夠改變this的指向

其實也就是根據點的左邊是什麼東西來判斷。

this用於繼承

方法 call ，能夠改變執行上下文環境。經過call去拿到其餘對象的方法，繼承爲本身的方法；

function superClass () {     
    this.a = 1;     
    this.print = function () {         
        console.log(this.a);     
    } 
}  
function subClass () {     
    superClass.call(this);     
    this.print(); 
}  
subClass(); // 1

subClass經過call方法，繼承了superClass的print方法和a變量，同時subClass還能夠擴展本身的其餘方法