全面解析JavaScript里的循环方法之forEach,for-in,for-of
JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。
JavaScript诞生已经有20多年了,我们一直使用的用来循环一个数组的方法是这样的:
for(varindex=0;index<myArray.length;index++){ console.log(myArray[index]); }
自从JavaScript5起,我们开始可以使用内置的forEach方法:
myArray.forEach(function(value){ console.log(value); });
写法简单了许多,但也有短处:你不能中断循环(使用语句或使用语句。
JavaScript里还有一种循环方法:。
for-in循环实际是为循环”enumerable“对象而设计的:
varobj={a:1,b:2,c:3}; for(varpropinobj){ console.log("obj."+prop+"="+obj[prop]); } //输出: //"obj.a=1" //"obj.b=2" //"obj.c=3"
你也可以用它来循环一个数组:
for(varindexinmyArray){//不推荐这样 console.log(myArray[index]); }
不推荐用for-in来循环一个数组,因为,不像对象,数组的index跟普通的对象属性不一样,是重要的数值序列指标。
总之,for–in是用来循环带有字符串key的对象的方法。
for-of循环
JavaScript6里引入了一种新的循环方法,它就是for-of循环,它既比传统的for循环简洁,同时弥补了forEach和for-in循环的短板。
我们看一下它的for-of的语法:
for(varvalueofmyArray){ console.log(value); }
for-of的语法看起来跟for-in很相似,但它的功能却丰富的多,它能循环很多东西。
for-of循环使用例子:
letiterable=[10,20,30]; for(letvalueofiterable){ console.log(value); } //10 //20 //30
我们可以使用来替代,这样它就变成了在循环里的不可修改的静态变量。
letiterable=[10,20,30]; for(constvalueofiterable){ console.log(value); } //10 //20 //30
循环一个字符串:
letiterable="boo"; for(letvalueofiterable){ console.log(value); } //"b" //"o" //"o" letiterable=newUint8Array([0x00,0xff]); for(letvalueofiterable){ console.log(value); } //0 //255 letiterable=newMap([["a",1],["b",2],["c",3]]); for(let[key,value]ofiterable){ console.log(value); } //1 //2 //3 for(letentryofiterable){ console.log(entry); } //[a,1] //[b,2] //[c,3] letiterable=newSet([1,1,2,2,3,3]); for(letvalueofiterable){ console.log(value); } //1 //2 //3
循环一个DOMcollection
循环一个DOMcollections,比如NodeList,之前我们讨论过如何循环一个NodeList,现在方便了,可以直接使用for-of循环:
//Note:Thiswillonlyworkinplatformsthathave //implementedNodeList.prototype[Symbol.iterator] letarticleParagraphs=document.querySelectorAll("article>p"); for(letparagraphofarticleParagraphs){ paragraph.classList.add("read"); }
循环一个拥有enumerable属性的对象
for–of循环并不能直接使用在普通的对象上,但如果我们按对象所拥有的属性进行循环,可使用内置的Object.keys()方法:
for(varkeyofObject.keys(someObject)){ console.log(key+":"+someObject[key]); }
循环一个生成器(generators)
我们可循环一个生成器(generators):
function*fibonacci(){//ageneratorfunction let[prev,curr]=[0,1]; while(true){ [prev,curr]=[curr,prev+curr]; yieldcurr; } } for(letnoffibonacci()){ console.log(n); //truncatethesequenceat1000 if(n>=1000){ break; } }
到此这篇关于全面解析JavaScript里的循环方法之forEach,for-in,for-of的文章就介绍到这了,更多相关js循环方法foreachforinforof内容请搜索毛票票以前的文章或继续浏览下面的相关文章希望大家以后多多支持毛票票!