js中箭頭函數的格式&this以及與普通函數的區別講解

本篇文章給大家帶來的內容是關於js中箭頭函數的格式&this以及與普通函數的區別講解，有一定的參考價值，有需要的朋友可以參考一下，希望對你有所協助。

箭頭函數的格式

// ES5var selected = allJobs.filter(function (job) {  return job.isSelected();});// ES6 箭頭函數var selected = allJobs.filter(job => job.isSelected());// ES6$("#confetti-btn").click(event => {  playTrumpet();  fireConfettiCannon();});

1、要編寫具有多個參數（或沒有參數或預設值或解構參數）的函數，在參數列表周圍添加括弧。
2、帶有塊體的箭頭函數不會自動傳回值。請使用return聲明。
3、使用箭頭函數建立普通對象時有一點需要注意。始終將對象括在括弧中：

this指向

箭頭函數沒有自己的this值。this箭頭函數內部的值始終從封閉範圍繼承。

對於將使用object.method()文法調用的方法，請使用非箭頭函數。這些函數將從調用者那裡獲得有意義的 this值。其他所有內容都使用箭頭功能。

{  ...  addAll: function addAll(pieces) {    var self = this;    _.each(pieces, function (piece) {      self.add(piece);    });  },  ...}// ES6{  ...  addAll: function addAll(pieces) {    _.each(pieces, piece => this.add(piece));  },  ...}

箭頭函數與普通函數得區別

箭頭和非箭頭函數之間還有一個小的區別：箭頭函數也沒有自己的arguments對象。

普通函數：
1、函數作為全域函數被調用時，this指向全域對象
2、函數作為對象中的方法被調用時，this指向該對象
3、函數作為建構函式的時候，this指向建構函式new出來的新對象
4、還可以通過call，apply，bind改變this的指向

1、箭頭函數沒有this，函數內部的this來自於父級最近的非箭頭函數，並且不能改變this的指向。
2、箭頭函數沒有super
3、箭頭函數沒有arguments
4、箭頭函數沒有new.target綁定。
5、不能使用new
6、沒有原型
7、不支援重複的具名引數。