js數組遍歷方法

來源:趣味經驗館 1.21W
<link rel="stylesheet" href="https://js.how234.com/third-party/SyntaxHighlighter/shCoreDefault.css" type="text/css" /><script type="text/javascript" src="https://js.how234.com/third-party/SyntaxHighlighter/shCore.js"></script><script type="text/javascript"> SyntaxHighlighter.all(); </script>

js數組遍歷方法有哪些?一起來看看小編今天的分享吧!

js數組遍歷,包括普通for循環、優化版for循環、弱化版for循環、foreach循環、foreach變種、forin循環、map遍歷等方法,以下將一一介紹這些數組遍歷方式。

第一種:普通for循環

代碼如下:

for(j = 0; j < arr.length; j++) {   }

普通for循環是最簡單的一種,也是使用頻率最高的一種。

第二種:優化版for循環

代碼如下:

for(j = 0,len=arr.length; j < len; j++) {   }

優化版for循環使用臨時變量,將長度快取起來,避免重複獲取數組長度,當數組較大時優化效果纔會比較明顯,這種方法基本上是所有循環遍歷方法中性能最高的一種。

第三種:弱化版for循環

代碼如下:for(j = 0; arr[j]!=null; j++) {   }

弱化版for循環其實嚴格上也屬於for循環,只不過是沒有使用length判斷,而使用變量本身判斷,性能要遠遠小於普通for循環。

第四種:foreach循環

代碼如下:

arr.forEach(function(e){     });

數組自帶的foreach循環,使用頻率較高,但性能比普通for循環弱。

第五種:foreach變種

代碼如下:

Array.prototype.forEach.call(arr,function(el){     });

由於foreach是Array型自帶的,對於一些非這種類型的,無法直接使用(如NodeList),所以纔有了這個變種,使用這個變種可以讓類似的數組擁有foreach功能,但實際性能要比普通foreach弱。

第六種:forin循環

代碼如下:

for(j in arr) {   }

forin循環在衆多的循環遍歷方式中效率最低。

第七種:map遍歷

代碼如下:

arr.map(function(n){     });

map遍歷實際效率弱於foreach。

第八種:forof遍歷(需要ES6支援)

代碼如下:

for(let value of arr) {     });

forof遍歷是es6裏面用到的,性能要好於forin,但仍然比不上普通for循環。

js數組遍歷方法


熱門標籤