箭頭函數的寫法特色

一、箭頭函數簡介

• 用 => 來標識
• 箭頭函數表達式的語法比函數表達式更簡潔，而且沒有本身的this，arguments，super或 new.target。這些函數表達式更適用於那些原本須要匿名函數的地方，而且它們不能用做構造函數。

二、一般函數的定義方法

var fn1 = function(a, b){
  console.log(a + b);
};
fn1(1, 2); // 3

function fn2(a, b){
  console.log(a - b);
}
fn2(2, 1);//1

三、簡寫寫法

對應上面兩個

//刪掉了function
var fn11 = (a, b)=>{   
  console.log(a+b);
};
fn11(1, 2); // 3
//刪掉了function和函數名,無心義
(a,b)=>{  
  console.log(a-b)
}

四、基礎語法

附加規則

• 當函數參數只有一個時，可省略小括號，但沒有時，不能省略。
• 函數體（中括號）中有且只有一行return語句時，中括號和return關鍵字能夠省略。
• 函數返回json對象，且只有一行return語句時，返回的簡寫要加小括號;如let add = a =>({"a":2})

(參數1, 參數2, …, 參數N) => { 函數聲明 }
    
    //至關於：(參數1, 參數2, …, 參數N) =>{ return 表達式; }
    (參數1, 參數2, …, 參數N) => 表達式（單一）
    
    // 當只有一個參數時，圓括號是可選的：
    (單一參數) => {函數聲明}
    單一參數 => {函數聲明}
    
    // 沒有參數的函數應該寫成一對圓括號。
    () => {函數聲明}

---

var add = function(a,b){
          return a+b;
        };
        // 即：
        var add = (a,b)=>{
          return a+b
        };
        // 即：
        var add = (a,b)=>a+b;
        ---------------------------------------------------------------------------------------
        var ret = function(a){
          return a+1;
        };
        // 即：
        var ret = a=>a+1;
        ---------------------------------------------------------------------------------------
        var non = function(){
          return 2+1;
        };
        // 即
        var non = ()=>2+1;

---

函數體代碼多於一行
        let fun1 = function(){
          console.log('1');
          console.log('2');
          return 1+2;
        }
        fun1();
        // 簡寫爲
        let fun2 = ()=>{
          console.log('1');
          console.log('2');
          return 1+2
        }
        fun2();

---

函數返回json對象時
        let f1 = function(){
          return {"a":2};
        }
        let f2 = ()=>{"a":2} // 錯誤
        let f2 = ()=>({"a":2})
        若是要返回一個對象，就要注意，若是是單表達式，這麼寫的話會報錯：
        x => { foo: x }
        由於和函數體的{ ... }有語法衝突，因此要改成：
        // ok:
        x => ({ foo: x })

---

實例
        let arr1 = [9,6,1,7];
        let arr11 = arr1.sort(
          function(a,b){
            return a-b;
          }  
        )
        console.log(arr11);
        let arr3= [2,3,9,5];
        let arr33 = arr3.sort((a,b)=>a-b)
        console.log(arr33)

五、總結

• 箭頭函數看上去是匿名函數的一種簡寫，但實際上，箭頭函數和匿名函數有個明顯的區別：箭頭函數內部的this是詞法做用域，由上下文肯定。
• 箭頭函數寫代碼擁有更加簡潔的語法。
• 不會綁定this，或者說箭頭函數中 不會改變this原本的綁定。