天要吐槽下，我時不時地看到有些文章說“循環語句不好，你應該用 filter，map 和 reduce ”——每次看到有文章鼓吹，所有需要循環的場景一律用這幾個函數式方法，我都恨得牙癢癢。

沒錯，這些函數式方法確實有它們的用途。我不是說你不能用它們，而是說不能不管三七二十一，到處濫用。在許多情況下，如果你想寫性能好的代碼，for 循環基本上是更好的選擇。

map, filter 和reduce等方法的目的是防止傳入的內容發生改變。在FP(函數式編程)風格中，向這些方法傳遞一個數組將返回一個新集合，而原始集合則保持不變。

對于map來說(因為它似乎是最容易被濫用和性能最差的)，與for循環相比，差異可能是顯著的。原因是map將創建一個新的副本，在每次迭代時觸發一個回調并消耗更多的內存。 for循環只是在執行迭代的內容，所以它幾乎沒有開銷。

有人專門創建了一個倉庫，將它們做了對比，對于大量數據的對比結果是驚人的(如果你知道這些方法的工作原理，你就一點也不覺得奇怪了)。

在我的 web應用中，我現在比以前更傾向于使用map, filter 和reduce。但我也注意到，在某些情況下，for循環是更好的選擇，因為for循環可以做這些方法不能做的事情。

中止循環

你可能已經知道了，可以使用break關鍵字來中止for循環。如果使用for循環遍歷數組，直到找到特定的值或運行了一定次數的迭代，就可以通過在循環中執行break來中止循環。

相反，map, filter 和reduce本身不能被終止；它們將一直迭代直到遍歷完數組中的每一項。

異步循環

for循環可以很容易地與async/await一起使用，這意味著你可以暫停循環，讓它等待一個promise被解決，然后再繼續迭代下一個值。

當你嘗試將async/await混合使用時，函數式方法map, filter 和reduce 將會產生混亂。如果 await累加器，你可以勉強讓reduce 正常工作，但總感覺不太對勁。

for 循環就容易多了，所以為什么自找麻煩呢？而且，async/await 可以在各種形式的for循環里使用。

你還在干這種事嗎？快住手

async function loadValues() {let myValues = await getValuesFromApi();myValues = myValues.map(value => {value.total = value.price * value.quantity;return value;}); }

有人用map遍歷對象數組，只是為了修改數組里的對象屬性值，然后又把整個結果賦值給原始數組，這種做法我見得太多了。map的本意其實是創建數組的一個副本，但是很多人把它當作循環來用，而且還把結果重新賦值給原來的變量，好歹用個新變量啊。

如果你也是這么做的，趁早糾正過來。用for循環就行了，因為那才是你本該做的。這種情況用map 你得不到任何好處。

總結

在大部分情況下，你用前面提到的任何一個函數式方法，在性能上跟傳統的for循環相比幾乎沒有差別。如果不是處理幾萬、幾十萬條數據，性能差別不超過100ms。

先用你認為合適的方式去寫代碼，然后如果發現性能不夠理想，你可以使用瀏覽器開發人員工具和常識來確定應用程序的哪些方面可以優化。

記住：過早的優化是萬惡之源。

作者：1024譯站
鏈接：https://www.jianshu.com/p/494ad0a7abba
來源：簡書

總結

以上是生活随笔為你收集整理的map for循环_JavaScript 用 for 循环太 low？你是不是有什么误解的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。