在Java中,可以使用for循环遍历数组中的对象,如下所示:
String[] myStringArray = {"Hello", "World"};
for (String s : myStringArray) {
// Do something
}
我可以在JavaScript中做同样的事情吗?
在Java中,可以使用for循环遍历数组中的对象,如下所示:
String[] myStringArray = {"Hello", "World"};
for (String s : myStringArray) {
// Do something
}
我可以在JavaScript中做同样的事情吗?
当前回答
例如,我在Firefox控制台中使用了:
[].forEach.call(document.getElementsByTagName('pre'), function(e){
console.log(e);
})
您可以使用querySelectorAll获得相同的结果
document.querySelectorAll('pre').forEach((e)=>{console.log(e.textContent);})<pre>文本1</pre><pre>文本2</pre><pre>文本3</pre>
其他回答
最好使用顺序for循环:
for (var i = 0; i < myStringArray.length; i++) {
// Do something
}
阵列循环:
for(var i = 0; i < things.length; i++){
var thing = things[i];
console.log(thing);
}
对象循环:
for(var prop in obj){
var propValue = obj[prop];
console.log(propValue);
}
var obj = ["one","two","three"];
for(x in obj){
console.log(obj[x]);
}
有几种方法可以在JavaScript中实现。前两个示例是JavaScript示例。第三个使用JavaScript库,即jQuery使用.each()函数。
var myStringArray=[“hello”,“World”];for(myStringArray中的var i){alert(myStringArray[i]);}
var myStringArray=[“hello”,“World”];for(var i=0;i<myStringArray.length;i++){alert(myStringArray[i]);}
var myStringArray=[“hello”,“World”];$.each(myStringArray,函数(索引,值){警报(值);})<script src=“https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js“></script>
三个主要选项:
对于(var i=0;i<xs.length;i++){console.log(xs[i]);}xs.forEach((x,i)=>console.log(x));for(xs的常量x){console.log(x);}
下面是详细的示例。
1.循环顺序:
var myStringArray=[“Hello”,“World”];var arrayLength=myStringArray.length;for(var i=0;i<arrayLength;i++){console.log(myStringArray[i]);//做点什么}
Pros
适用于各种环境可以使用break和continue流控制语句
Cons
过于冗长迫切的容易出现一个错误(有时也称为围栏柱错误)
2.阵列.原型.每个:
ES5规范引入了许多有益的数组方法。其中一个是Array.prototype.forEach,它为我们提供了一种简单的方法来遍历数组:
常量数组=[“一”,“二”,“三”]array.forEach(函数(项,索引){console.log(项,索引);});
在撰写ES5规范发布之时(2009年12月)已近十年,它已被桌面、服务器和移动环境中的几乎所有现代引擎实现,因此使用它们是安全的。
使用ES6箭头函数语法,它更加简洁:
array.forEach(item => console.log(item));
箭头功能也被广泛实现,除非您计划支持古老的平台(例如Internet Explorer 11);你去也很安全。
Pros
非常简短和简洁。声明的
Cons
无法使用中断/继续
通常,您可以通过在迭代数组元素之前过滤数组元素来代替中断命令循环的需要,例如:
array.filter(item => item.condition < 10)
.forEach(item => console.log(item))
请记住,如果您正在迭代一个数组以从中构建另一个数组,则应该使用map。我见过很多次这种反模式。
反模式:
const numbers = [1,2,3,4,5], doubled = [];
numbers.forEach((n, i) => { doubled[i] = n * 2 });
地图的正确使用情况:
常量=[1,2,3,4,5];常量doubled=numbers.map(n=>n*2);console.log(加倍);
此外,如果您试图将数组缩减为一个值,例如,您希望对一个数字数组求和,则应使用reduce方法。
反模式:
const numbers = [1,2,3,4,5];
const sum = 0;
numbers.forEach(num => { sum += num });
正确使用reduce:
常量=[1,2,3,4,5];常量sum=数字。减少((total,n)=>total+n,0);console.log(总和);
3.声明的ES6:
ES6标准引入了可迭代对象的概念,并定义了用于遍历数据的新构造,即for。。。声明。
此语句适用于任何类型的可迭代对象,也适用于生成器(任何具有\[Symbol.iiterator\]属性的对象)。
根据定义,数组对象是ES6中内置的可迭代对象,因此可以对它们使用以下语句:
let colors = ['red', 'green', 'blue'];
for (const color of colors){
console.log(color);
}
Pros
它可以遍历大量对象。可以使用正常的流量控制语句(中断/继续)。用于迭代串行异步值。
Cons
如果您的目标是较旧的浏览器,则转译的输出可能会让您大吃一惊。
不用于。。。在里面
@zipcodeman建议使用for。。。在语句中,但对于迭代数组,应该避免for-in,该语句旨在枚举对象财产。
它不应用于类似数组的对象,因为:
迭代的顺序没有保证;数组索引不能按数字顺序访问。还枚举了继承的财产。
第二点是它会给您带来很多问题,例如,如果您扩展Array.prototype对象以在其中包含一个方法,那么该属性也会被枚举。
例如:
Array.prototype.foo=“foo!”;var数组=[‘a’,‘b’,‘c’];for(数组中的变量i){console.log(array[i]);}
上面的代码将控制台日志“a”、“b”、“c”和“foo!”。
如果您使用一些严重依赖原生原型扩充的库(如MooTools),这可能是一个特别的问题。
如前所述,for-in语句用于枚举对象财产,例如:
变量obj={“a”:1,“b”:2,“c”:3};for(obj中的var属性){if(obj.hasOwnProperty(prop)){//或如果(Object.protype.hasOwnProperty.call(obj,prop))安全。。。console.log(“prop:”+prop+“value:”+obj[prop])}}
在上面的示例中,hasOwnProperty方法允许您仅枚举自己的财产。就是这样,只有对象物理上具有的财产,没有继承的财产。
我建议您阅读以下文章:
枚举VS迭代