一、循環(huán)遍歷語句

for...in... （ES5）

語法：javascript for(keys in obj){}
適用：遍歷對象
說明：
　　1.keys表示obj對象的每一個(gè)鍵值對的鍵(鍵名)，所有循環(huán)中，需要使用obj[keys]來取到每一個(gè)值。
　　2.for-in 循環(huán)，遍歷時(shí)不僅能讀取對象自身上面的成員屬性，也能延續(xù)原型鏈遍歷出對象的原型屬性
　　3.使用hasOwnProperty判斷一個(gè)屬性是不是對象自身上的屬性。obj.hasOwnProperty(keys)==true 表示這個(gè)屬性是對象的成員屬性，而不是原型屬性

for...of... （ES6）

語法：javascript for(keys of xxx){}
適用：數(shù)組、Set和Map結(jié)構(gòu)、某些類似數(shù)組的對象（比如arguments對象、DOM NodeList 對象）、Generator 對象，以及字符串
說明：ES6 借鑒 C++、Java、C# 和 Python 語言，引入了for...of循環(huán)，作為遍歷所有數(shù)據(jù)結(jié)構(gòu)的統(tǒng)一的方法。
　一個(gè)數(shù)據(jù)結(jié)構(gòu)只要部署了Symbol.iterator屬性，就被視為具有iterator接口，就可以用for...of循環(huán)遍歷它的成員。
也就是說，for...of循環(huán)內(nèi)部調(diào)用的是數(shù)據(jù)結(jié)構(gòu)的Symbol.iterator方法。
　
其他：
for (let [key,value] of Object.entries(obj))
for (let key of Object.keys(obj))
for (let key of Object.values(obj))

1.Object.keys()
返回一個(gè)數(shù)組，成員是參數(shù)對象自身的（不含繼承的）所有可遍歷（ enumerable ）屬性的鍵名。

2.Object.values()
返回一個(gè)數(shù)組，成員是參數(shù)對象自身的（不含繼承的）所有可遍歷（ enumerable ）屬性的鍵值。

3.Object.entries()
返回一個(gè)數(shù)組，成員是參數(shù)對象自身的（不含繼承的）所有可遍歷（ enumerable ）屬性的鍵值對數(shù)組。

forEach (ES5)

語法：javascript [].forEach(callbackfn[, thisArg])
適用： 遍歷數(shù)組，不改變原數(shù)組
說明：對數(shù)組里存在的每個(gè)元素調(diào)用一次 callbackfn。callbackfn 只被實(shí)際存在的數(shù)組元素調(diào)用；它不會被缺少的數(shù)組元素調(diào)用。
如果提供了一個(gè) thisArg 參數(shù)，它會被當(dāng)作 this 值傳給每個(gè) callbackfn 調(diào)用。如果沒提供它，用 undefined 替代。

callbackfn參數(shù)，分別為值、下標(biāo)、數(shù)組本身

[].forEach(function(value, index, array) {// ... });

對比jQuery中的$.each方法：

$.each([], function(index, value, array) {// ... });

缺點(diǎn)：

不能使用break語句中斷循環(huán)

不能使用return語句返回到外層函數(shù)

map (ES5)

語法： javascript [].map(callbackfn[, thisArg]);
說明：map方法可以返回一個(gè)處理過的新數(shù)組，不改變原數(shù)組

callbackfn參數(shù)，分別為值、下標(biāo)、數(shù)組本身

[].map(function(value, index, array) {// ...return ..... });

二、比較

for...in缺點(diǎn)

　　①數(shù)組的鍵名是數(shù)字，但是for...in循環(huán)是以字符串作為鍵名“0”、“1”、“2”等等。
　　②不僅遍歷數(shù)字鍵名，還會遍歷手動添加的其他鍵，甚至包括原型鏈上的鍵。
　　③某些情況下，會以任意順序遍歷鍵名，主要是為遍歷對象而設(shè)計(jì)的，不適用于遍歷數(shù)組。

for...of優(yōu)點(diǎn)

　　①有著同for...in一樣的簡潔語法，但是沒有for...in那些缺點(diǎn)。
　　②不同于forEach方法，它可以與break、continue和return配合使用。
　　③提供了遍歷所有數(shù)據(jù)結(jié)構(gòu)的統(tǒng)一操作接口。

三、循環(huán)控制語句

1、break：跳出本層循環(huán)，繼續(xù)執(zhí)行循環(huán)結(jié)構(gòu)后面的語句。如果循環(huán)有多層，則break只能跳出一層。

2、continue：跳過本次循環(huán)剩余的代碼，跳轉(zhuǎn)到表達(dá)式處進(jìn)行下一次的循環(huán)判斷，繼續(xù)執(zhí)行下一次循環(huán)。
　　　①對與for循環(huán)，continue之后執(zhí)行的語句，是循環(huán)變量更新語句i++；
　　　②對于while、do-while循環(huán)，continue之后執(zhí)行的語句，是循環(huán)條件判斷；
　　　因此，使用這兩個(gè)循環(huán)時(shí)，必須將continue放到i++之后使用，否則，continue將跳過i++進(jìn)入死循環(huán)

3、return：在程序（函數(shù)）中遇到return語句，那么代碼就退出該函數(shù)的執(zhí)行，返回到函數(shù)的調(diào)用處；如果是主程序（main()），那么結(jié)束整個(gè)程序的運(yùn)行。

4、exit: 其他語言中使用，如C、C++等。調(diào)用exit()函數(shù)將會結(jié)束當(dāng)前進(jìn)程，同時(shí)刪除子進(jìn)程所占用的內(nèi)存空間，把返回信息傳給父進(jìn)程。
當(dāng)exit()中的參數(shù)為0時(shí)，表示正常退出，其他返回值表示非正常退出，執(zhí)行exit()函數(shù)意味著進(jìn)程結(jié)束；
而return僅表示調(diào)用堆棧的返回，其作用是返回函數(shù)值，并且退出當(dāng)前執(zhí)行的函數(shù)體，返回到函數(shù)的調(diào)用處，
在main()函數(shù)中， return n和exit(n)是等價(jià)的。

轉(zhuǎn)載于:https://www.cnblogs.com/136asdxxl/p/9783690.html

總結(jié)

以上是生活随笔為你收集整理的JS 循环遍历 总结的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。