ES6的箭頭函數

最近在學習ES6箭頭函數,總結一下有幾個特徵

  1. 參數 => 表達式/語句 
  2. 繼承外層作用域
  3. 不能用作構造函數
  4. 沒有prototype屬性

下面針對這4點分別舉例驗證

1 基本格式 : 

以前寫法:

function foo (number){

        return number * 5 ;

}

箭頭函數寫法

let foo = number => number*5 ;

let foo = number =>{

        return number * 5 ;

}

2 繼承外層作用域

let obj ={
    commonFn:function(){
        console.log(this)
    },
    arrowFn:()=>{
        console.log(this)
    }
}

obj.commonFn(); // obj
obj.arrowFn();  // window

3 不能用作構造函數

用普通函數當作構造函數

let Fn = function(){
    this.name = "common";
}
let fn = new Fn ();
console.log(fn.name)

用箭頭函數當作構造函數(會報錯)

let Fn = ()=>{
    this.name = "common";
}
let fn = new Fn ();   //報錯: Fn is not a constructor
console.log(fn.name)

4 沒有prototype屬性

let commonFn = function(){}
let arrowFn = ()=>{}
console.log(commonFn.prototype);  // {constructor: ƒ}
console.log(arrowFn.prototype);  //undefined

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章