快捷導(dǎo)航

詳解Js里的for…in和for…of的用法

更新時(shí)間：2019年03月28日 15:06:23 作者：chicNancy

這篇文章主要介紹了Js里的for…in和for…of的用法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

之前看編程方法學(xué)，for循環(huán)的基本格式是

for(init;test;step ){
 statement
}
//例如
for(int i=0,i<10;i++){
 ...
}

后來(lái)接觸了python，for循環(huán)的格式更加的簡(jiǎn)單優(yōu)雅，只要一個(gè)for ……in語(yǔ)句就可以直接遍歷對(duì)象。

for i in arry

今天看廖雪峰的官網(wǎng)，居然看到了js里更神奇的操作，for ……of循環(huán)，這個(gè)類似于python的for ……in循環(huán)了，雖然js里也有for ……in循環(huán)，可是遍歷的是對(duì)象的屬性，類似于鍵值對(duì)里的鍵key，當(dāng)它遍歷array的時(shí)候遍歷的是array的索引，

var a = ['A', 'B', 'C'];
for (var i in a) {
 alert(i); // '0', '1', '2'
 alert(a[i]); // 'A', 'B', 'C'
}

or … of循環(huán)是ES6引入的新的語(yǔ)法，用for … of循環(huán)遍歷集合，用法如下：

var a = ['A', 'B', 'C'];
var s = new Set(['A', 'B', 'C']);
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
for (var x of a) { // 遍歷Array
 alert(x);//'A', 'B', 'C'
}
for (var x of s) { // 遍歷Set
 alert(x);//'A', 'B', 'C'
}
for (var x of m) { // 遍歷Map
 alert(x[0] + '=' + x[1]);//1='x',2='y',3='z'
}

for … in循環(huán)由于歷史遺留問(wèn)題，它遍歷的實(shí)際上是對(duì)象的屬性名稱。一個(gè)Array數(shù)組實(shí)際上也是一個(gè)對(duì)象，它的每個(gè)元素的索引被視為一個(gè)屬性。
當(dāng)我們手動(dòng)給Array對(duì)象添加了額外的屬性后，for … in循環(huán)將帶來(lái)意想不到的意外效果：

var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
 alert(x); // '0', '1', '2', 'name'
}

for … in循環(huán)將把name包括在內(nèi)，但Array的length屬性卻不包括在內(nèi)。

for … of循環(huán)則完全修復(fù)了這些問(wèn)題，它只循環(huán)集合本身的元素：

var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x of a) {
 alert(x); // 'A', 'B', 'C'
}

以上所述是小編給大家介紹的Js里的for…in和for…of的用法詳解整合，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

Js
for
in
for
of

欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

詳解Js里的for…in和for…of的用法

相關(guān)文章

最新評(píng)論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具