每日前端夜話，陪你聊前端。
每天晚上18:00準時推送。
正文共：916 字
預計閱讀時間：7 分鐘
作者：Deepak Gupta
翻譯：瘋狂的技術宅
來源：codeburst
我們都知道 for 循環比 each 或 javascript 函數更快，因為在javascript函數的引擎下可能會使用for循環或其他我不確定的東西。我使用一個對象數組進行了一個簡單的測試，並通過loop/for each/javascript 函數執行一些操作，並觀察執行所需的時間。
這些結果來自小例子，可能根據執行的操作和執行環境的選擇而有所不同。還與 VM 的選擇有關。
1. Reduce vs for循環 vs foreach 1
2const posts = [
3 {id: 1, upVotes: 2},
4 {id: 2, upVotes: 18},
5 {id: 3, upVotes: 1},
6 {id: 4, upVotes: 30},
7 {id: 5, upVotes: 50}
8];let sum = 0;
9console.time('reduce');
10sum = posts.reduce((s, p)=> s+=p.upVotes,0);
11console.timeEnd('reduce')sum = 0;
12console.time('for loop');
13for(let i=0; i<posts.length; i++) {
14 sum += posts[i].upVotes;
15}
16console.timeEnd('for loop');sum = 0;
17console.time('for each');
18posts.forEach(element => {
19 sum += element.upVotes;
20});console.timeEnd('for each');
注意：下面是結果列表，代碼可以在這裡【https://github.com/dg92/Performance-analysis-es6】找到。
Map/Reduce/Filter/Find 很慢的原因有許多，其中有
他們有一個回調，會產生開銷。
javascript 函數需要考慮很多極端情況，比如 getter、稀疏數組和檢查傳遞的參數是否是數組，這會增加開銷。
我找到了一個 庫。重新實現幾個常見的內置原生 JavaScript 函數。
但是使用的原則不僅僅取決於性能，還有更多因素需要考慮，其中一些是：
代碼可讀性和可維護性
輕鬆編碼
快速編碼
實施和優化
個人選擇
就個人而言，我喜歡 map、reduce、filter 和 find，並且我也使用過很長一段時間。他們幫助我寫出乾淨、精確、快速並符合我思路的點代碼。當我別無選擇時，會使用 for 循環。
就優化而言，map/reduce/filter/find 替換應該是最後的選擇，或者根本就不是一個選項，其具體取決於你所需的優化級別。
注意：如果你正在使用循環，請始終用慣用方式使用，因為編譯器現在能夠以正確的方式去優化慣用循環
更新：你可以在這裡【https://github.com/dg92/Performance-analysis-es6】找到大數據集和複雜計算的結果。
原文：https://codeburst.io/javascript-performance-test-for-vs-for-each-vs-map-reduce-filter-find-32c1113f19d7
下面夾雜一些私貨：也許你和高薪之間只差這一張圖
2019年京程一燈課程體系上新，這是我們第一次將全部課程列表對外開放。
願你有個好前程，願你月薪30K。我們是認真的 ！
在公眾號內回復「體系」查看高清大圖
長按二維碼，加大鵬老師微信好友
拉你加入前端技術交流群
嘮一嘮怎樣才能拿高薪
小手一抖，資料全有。長按二維碼關注前端先鋒，閱讀更多技術文章和業界動態。