面試題--爲什麼普通 `for` 循環的性能遠遠高於 `forEach` 的性能,請解釋其中的原因。

let arrs = new Array(100000);

console.time('for');
for (let i = 0; i < arrs.length; i++) {

};
console.timeEnd('for');

console.time('forEach');
	
arrs.forEach((arr) => {
 
});
console.timeEnd('forEach');

for: 2.263ms
forEach: 0.254ms

在10萬這個級別下,forEach 的性能是 for 的十倍

for: 1.703857421875ms
forEach: 0.239013671875ms

在100萬這個量級下,forEach 的性能是和 for 一致的。

for: 2.302001953125ms
forEach: 2.081787109375ms

在1000萬級以上的量級上 , forEach 的性能遠遠低於for的性能。

for: 7.581787109375ms
forEach: 22.27978515625ms

那其實在 https://jsperf.com/ 裏面測試,還是 for 的性能更好一些(10萬次內)。

個人理解:

在 forEach 的語法上:

arr.forEach(callback(currentValue [, index [, array]])[, thisArg])

可以看到 forEach 是有回調的,它會按升序爲數組中含有效值的每一項執行一次 callback,且除了拋出異常以外,也沒有辦法中止或者跳出 forEach 循環。那這樣的話執行就會額外的調用棧和函數內的上下文。

而 for 循環則是底層寫法,不會產生額外的消耗。

那在實際業務中沒有很大的數組時,for 和 forEach 的性能差距其實很小,forEach 甚至會優於 for 的時間,且更加簡潔,可讀性也更高,一般也會優先使用 forEach 方法來進行數組的循環處理。

在兼容性上,肯定是 for 循環的兼容優於 forEach 的了。
在這裏插入圖片描述
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章