箭頭函數語法學習()


箭頭函數語法學習()


// 六種語言中的簡單函數示例 function (a) { return a > 0; } // JS [](int a) { return a > 0; } // C++ (lambda (a) (> a 0)) ;; Lisp lambda a: a > 0 # Python a => a > 0 // C# a -> a > 0 // Java

箭袋中的新羽

ES6中引入了一種編寫函數的新語法

    // ES5 var selected = allJobs.filter(function (job) { return job.isSelected(); }); // ES6 var selected = allJobs.filter(job => job.isSelected());

當你只需要一個只有一個參數的簡單函數時,可以使用新標准中的箭頭函數,它的語法非常簡單:標識符=>表達式。你無需輸入functionreturn,一些小括號、大括號以及分號也可以省略。

(我個人對於這個特性非常感激,不再需要輸入function這幾個字符對我而言至關重要,因為我總是不可避免地錯誤寫成functoin,然后我就不得不回過頭改正它。)

那么不是非常函數化的情況又如何呢?除表達式外,箭頭函數還可以包含一個塊語句。回想一下我們之前的示例:

    // ES5 $("#confetti-btn").click(function (event) { playTrumpet(); fireConfettiCannon(); });

這是它們在ES6中看起來的樣子:

    // ES6 $("#confetti-btn").click(event => { playTrumpet(); fireConfettiCannon(); });

這是一個微小的改進,對於使用了Promises的代碼來說箭頭函數的效果可以變得更加戲劇性,}).then(function (result) { 這樣的一行代碼可以堆積起來。

注意,使用了塊語句的箭頭函數不會自動返回值,你需要使用return語句將所需值返回。

小提示:當使用箭頭函數創建普通對象時,你總是需要將對象包裹在小括號里。

    // 為與你玩耍的每一個小狗創建一個新的空對象 var chewToys = puppies.map(puppy => {}); // 這樣寫會報Bug! var chewToys = puppies.map(puppy => ({})); //

用小括號包裹空對象就可以了。

不幸的是,一個空對象{}和一個空的塊{}看起來完全一樣。ES6中的規則是,緊隨箭頭的{被解析為塊的開始,而不是對象的開始。因此,puppy => {}這段代碼就被解析為沒有任何行為並返回undefined的箭頭函數。

更令人困惑的是,你的JavaScript引擎會將類似{key: value}的對象字面量解析為一個包含標記語句的塊。幸運的是,{是唯一一個有歧義的字符,所以用小括號包裹對象字面量是唯一一個你需要牢記的小竅門。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM