ES6箭頭函式

2021-09-12 18:30:06 字數 1501 閱讀 3637

語法：

([param] [, param]) => 


param => expression
使用：

（  ）=>； //零個引數用（）表示


x  =>； //乙個引數，可以省略（） 


(x,y)=>； //多個引數不能省略（）


**多行語句需要用{}括起來，單行表示式不需要{}，並且會作為函式返回值。**
特性：

箭頭函式內部沒有constructor方法，也沒有prototype，所以不支援new操作。但是它對this的處理與一般的普通函式不一樣。箭頭函式的 this 始終指向函式定義時的 this，而非執行時。

例如：

var o = ,


test : function() , 100);


}};o.test(); // typeerror : this.fn is not a function
上面的**會出現錯誤，因為this的指向從o變為了全域性（函式呼叫中的this都是指向全域性的）。

要修改上面的**如下：

var o = ,


test : function() , 100);


}};o.test();
通過使用外部事先儲存的this就行了。

利用到箭頭函式修改，箭頭函式的 this 始終指向函式定義時的 this，而非執行時。

var o = ,


test : function() , 100);


}};o.test();
這回this就指向o了。箭頭函式可以讓settimeout裡面的this，繫結定義時所在的作用域，而不是指向執行時所在的作用域。

上面**中，轉換後的es5版本清楚地說明了，箭頭函式裡面根本沒有自己的this，而是引用外層的this。

var x = 1,


o = 


};console.log(o.test()); // 1


console.log(o.test.call(o)); // 依然是1
如果箭頭函式的**塊部分多於一條語句，就要使用大括號將它們括起來，並且使用return語句返回。

var sum = (num1, num2) =>
由於大括號被解釋為**塊，所以如果箭頭函式直接返回乙個物件，必須在物件外面加上括號。

var gettempitem = id => ();

使用注意點

es6箭頭函式

本例是在了解es6知識後在原來定義函式的基礎上進行理解var searchvalue 查詢匹配物件 var button var input var select button if searchvalue.input undefined button.click else 重新整理 tableli...

es6 箭頭函式

1.單引數 function cheng a 3 let cheng a 3 a a console.log cheng 9 2.多引數 function add a,b let add a,b a b 預設返回值 console.log add 3,9 3.無返回值 function add a,...

ES6 箭頭函式

es6 中，箭頭函式就是函式的一種簡寫形式，使用括號包裹數，跟隨乙個 緊接著是函式體 var getprice function 箭頭函式 var getprice 9.15 箭頭函式不僅僅是讓 變得簡潔，函式中 this 總是繫結總shi 指向物件自身 function person 1000 使...