for ... in
for循環(huán)的一個(gè)變體是for ... in循環(huán),它可以把一個(gè)對(duì)象的所有屬性依次循環(huán)出來(lái):
由于Array也是對(duì)象捌蚊,而它的每個(gè)元素的索引被視為對(duì)象的屬性,因此,for ... in循環(huán)可以直接循環(huán)出Array的索引:
請(qǐng)注意厉亏,for ... in對(duì)Array的循環(huán)得到的是String而不是Number垄提。
for ... of循環(huán)和for ... in循環(huán)有何區(qū)別榔袋?
for ... in循環(huán)由于歷史遺留問(wèn)題,它遍歷的實(shí)際上是對(duì)象的屬性名稱(chēng)铡俐。一個(gè)Array數(shù)組實(shí)際上也是一個(gè)對(duì)象凰兑,它的每個(gè)元素的索引被視為一個(gè)屬性。
當(dāng)我們手動(dòng)給Array對(duì)象添加了額外的屬性后审丘,for ... in循環(huán)將帶來(lái)意想不到的意外效果:
vara =['A','B','C'];
a.name = 'Hello';
for(varxina){
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)集合本身的元素:
vara =['A','B','C'];
a.name = 'Hello';
for(varx of a){
alert(x);// 'A','B','C'
}
這就是為什么要引入新的for ... of循環(huán)锅知。
更好的方式是直接使用iterable內(nèi)置的forEach方法,它接收一個(gè)函數(shù)脓钾,每次迭代就自動(dòng)回調(diào)該函數(shù)售睹。以Array為例:
vara =['A','B','C'];
a.forEach(function(element,index,array){
// element:指向當(dāng)前元素的值
// index:指向當(dāng)前索引
// array:指向Array對(duì)象本身
alert(element);
});
Set與Array類(lèi)似,但Set沒(méi)有索引可训,因此回調(diào)函數(shù)的前兩個(gè)參數(shù)都是元素本身:
vars =newSet(['A','B','C']);
s.forEach(function(element,sameElement,set){
alert(element);
});
Map的回調(diào)函數(shù)參數(shù)依次為value昌妹、key和map本身:
varm =newMap([[1,'x'],[2,'y'],[3,'z']]);
m.forEach(function(value,key,map){
alert(value);
});
如果對(duì)某些參數(shù)不感興趣,由于JavaScript的函數(shù)調(diào)用不要求參數(shù)必須一致握截,因此可以忽略它們捺宗。例如,只需要獲得Array的element:
vara =['A','B','C'];
a.forEach(function(elem
ent){
alert(element);
});