js箭頭函數

ES6標準新增了一種新的函數：Arrow Function(箭頭函數)。

爲何叫Arrow Function？由於它的定義用的就是一個箭頭

x =>x*x

至關於:

function(x) {
            return x*x;
        }

箭頭函數至關於匿名函數，而且簡化了函數定義。箭頭函數有兩種格式，一種像上面的，只包含一個表達式，連{……}和return都省略掉了。還有一種能夠包含多條語句。這個時候就不能省略{……}和return：

　　　　x=>{
            if(x>0){
                return x*x;
            }
            else {
                return - x*x;
            }
        }

若是參數不是一個，就須要用括號（）起來：

　　　　//兩個參數：
        (x,y) => x * x + y * y
        //無參數
        () => 3.14
        //可變參數：
        (x,y,...rest) =>{
            var i,sum=x+y;
            for(i=0;i<rest.length;i++) {
                sum += rest[i];
            }
            return sum;
        }

若是要返回一個對象，就要注意，若是是單表達式，要這麼寫：

//SyntaxError
x =>{foo:x}

//由於和函數體的{……}有語法衝突，因此：
//ok
x=>({foo:x})

 

this

箭頭函數看上去是匿名函數的一種簡寫，可是實際上，箭頭函數和匿名函數有個明顯的區別：箭頭函數內部的this是詞法做用域，由上下文肯定。因爲JavaScript函數對this綁定的錯誤處理。下面的例子沒法獲得預期結果：

　　var obj = {
            birth:1990,
            getAge:function(){
                var b = this.birth;//1990
                var fn = function(){
                    return new Date().getFullYear() - this.birth;//this指向window或undefined
                };
                return fn();
            }
        };

如今，箭頭函數徹底修復了this的指向，this老是指向詞法做用域，也就是外層調用者obj：

　　　　var obj = {
            birth:1990,
            getAge:function () {
                var b = this.birth;//1990
                var fn = () => new Date().getFullYear() - this.birth;//this指向obj對象
                return fn();
            }
        };
        obj.getAge();//27

因爲this在箭頭函數中已經按照詞法做用域綁定了，因此，用call()或者apply()調用箭頭函數時，沒法對this進行綁定，即傳入的第一個參數被忽略：

　　　　var obj = {
            birth:1990,
            getAge:function(year) {
                var b = this.birth;//1990
                var fn = (y) =>y-this.birth;//this.birth還是1990
                return fn.call({birth:2000},year);
            }
        };
        obj.getAge(2015);//25