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

來源:互聯網
上載者:User
本篇文章給大家帶來的內容是關於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、不支援重複的具名引數。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.