ES6:箭頭函數的特點及this問題

箭頭函數是用來簡化函數定義文法的：

// 如下就是一個箭頭函數
const fn = () => {
    console.log(123);
}
fn();
           

1.在箭頭函數中，如果{}函數體隻有一句代碼，且代碼的執行結果就是函數的傳回值，函數體大括号{}可以省略不寫。

const fn = (x,y) => {
            return x+y;
        }
        console.log(fn(1,3)); // 4

        // 可以這樣簡寫
        const fn2 = (n1,n2) => n1+n2;
        console.log(fn2(2,3)); // 5
           

2.在箭頭函數中，如果形參隻有一個，可以省略小括号()。

// 形參隻有一個num 且執行結果就是函數的傳回值
      const fun = num => num;
      console.log(fun(20)); // 20
           

3.箭頭函數不綁定this關鍵字，箭頭函數中的this，指向的是函數定義位置的上下文this。

// 箭頭函數不綁定this關鍵字，箭頭函數中的this，指向的是函數定義位置的上下文this。
      const obj = {name:"Axx",age:19};
      const fn = () => {
          console.log(this);
      }
      fn.call(obj); // this指向還是window，因為箭頭函數沒有自己的this


      function fn2(){
          console.log(this); // fn2普通函數this指向obj
          return () => {
              console.log(this);
          }
      }
  // 此時箭頭函數的this指向obj，因為箭頭函數處于fn2函數體當中，而fn2的this指向的是obj，是以箭頭函數的this也指向obj
      fn2.call(obj)();