在Java中,可以使用for循环遍历数组中的对象,如下所示:

String[] myStringArray = {"Hello", "World"};
for (String s : myStringArray) {
    // Do something
}

我可以在JavaScript中做同样的事情吗?


当前回答

如果您正在使用jQuery库,请考虑使用http://api.jquery.com/jQuery.each/

根据文档:

jQuery.each(集合,回调(indexInArray,valueOfElement))返回:对象描述:一个泛型迭代器函数,可用于对对象和数组进行无缝迭代。数组和类数组具有长度属性的对象(例如函数的arguments对象)由数值索引从0到长度-1进行迭代。其他对象包括通过其命名的财产进行迭代。$.each()函数与$(selector).each(用于以独占方式对jQuery对象进行迭代。$.each()函数可以用于迭代任何集合,无论它是map(JavaScript对象)或数组。在数组的情况下回调被传递一个数组索引和一个相应的数组值时间(该值也可以通过this关键字访问,但是Javascript将始终将this值包装为Object,即使它是简单的字符串或数字值。)该方法返回其第一个参数,迭代的对象。

其他回答

三个主要选项:

对于(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迭代

您可以使用map,这是一种函数式编程技术,也可以在Python和Haskell等其他语言中使用。

[1,2,3,4].map( function(item) {
     alert(item);
})

一般语法为:

array.map(func)

一般来说,func需要一个参数,这是数组的一个项。但在JavaScript的情况下,它可以接受第二个参数,即项目的索引,以及第三个参数,也就是数组本身。

array.map的返回值是另一个数组,因此可以这样使用:

var x = [1,2,3,4].map( function(item) {return item * 10;});

现在x是[10,20,30,40]。

您不必内联编写函数。它可能是一个单独的功能。

var item_processor = function(item) {
      // Do something complicated to an item
}

new_list = my_list.map(item_processor);

这相当于:

 for (item in my_list) {item_processor(item);}

除非你没有得到new_list。

如果您想使用jQuery,它的文档中有一个很好的示例:

 $.each([ 52, 97 ], function( index, value ) {
      alert( index + ": " + value );
 });

介绍

从大学时代开始,我就用Java、JavaScript、Pascal、ABAP、PHP、Progress 4GL、C/C++以及其他一些我现在想不出来的语言编程。

虽然它们都有自己的语言特点,但每种语言都有许多相同的基本概念。这些概念包括过程/函数、IF语句、FOR循环和WHILE循环。


传统的for循环

传统的for循环有三个组成部分:

初始化:在第一次执行look块之前执行条件:每次执行循环块之前检查一个条件,如果为false,则退出循环事后思考:每次执行循环块后执行

这三个组件通过一个;象征这三个组件中每一个的内容都是可选的,这意味着以下内容是可能的最小循环:

for (;;) {
    // Do stuff
}

当然,您需要在for循环中的某处包含if(条件==true){break;}或if(条件===true){return;},以使其停止运行。

不过,通常情况下,初始化用于声明索引,条件用于将该索引与最小值或最大值进行比较,而事后考虑用于增加索引:

for (var i = 0, length = 10; i < length; i++) {
    console.log(i);
}

使用传统的for循环遍历数组

循环遍历数组的传统方法是:

for (var i = 0, length = myArray.length; i < length; i++) {
    console.log(myArray[i]);
}

或者,如果您喜欢向后循环,请执行以下操作:

for (var i = myArray.length - 1; i > -1; i--) {
    console.log(myArray[i]);
}

然而,也有许多可能的变化,例如:

for (var key = 0, value = myArray[key], length = myArray.length; key < length; value = myArray[++key]) {
    console.log(value);
}

…或者这个。。。

var i = 0, length = myArray.length;
for (; i < length;) {
    console.log(myArray[i]);
    i++;
}

…或这个:

var key = 0, value;
for (; value = myArray[key++];){
    console.log(value);
}

无论哪种方法最有效,很大程度上都取决于个人品味和您正在实现的具体用例。

请注意,所有浏览器都支持这些变体,包括非常旧的浏览器!


while循环

for循环的一种替代方法是while循环。要循环遍历数组,可以执行以下操作:

var key = 0;
while(value = myArray[key++]){
    console.log(value);
}

与传统的for循环一样,即使是最古老的浏览器也支持循环。

此外,请注意,everywhile循环可以重写为for循环。例如,上面的while循环的行为与For循环完全相同:

for(var key = 0; value = myArray[key++];){
    console.log(value);
}

对于为。。。属于

在JavaScript中,您也可以这样做:

for (i in myArray) {
    console.log(myArray[i]);
}

然而,这应该谨慎使用,因为它在所有情况下的行为都与传统的for循环不同,并且需要考虑潜在的副作用。请参见为什么对数组迭代使用“for…in”是一个坏主意?了解更多详情。

作为…的替代方案。。。在,现在还有。。。属于以下示例显示了for。。。的循环和for。。。循环中:

var myArray = [3, 5, 7];
myArray.foo = "hello";

for (var i in myArray) {
  console.log(i); // logs 0, 1, 2, "foo"
}

for (var i of myArray) {
  console.log(i); // logs 3, 5, 7
}

此外,您需要考虑没有版本的Internet Explorer支持。。。(边缘12+有)和。。。中至少需要Internet Explorer 10。


Array.prototype.forEach()

for循环的另一种选择是Array.prototype.forEach(),它使用以下语法:

myArray.forEach(function(value, key, myArray) {
    console.log(value);
});

所有现代浏览器以及Internet Explorer 9和更高版本都支持Array.prototype.forEach()。


图书馆

最后,许多实用程序库也有自己的foreach变体。AFAIK,最受欢迎的三个是:

jQuery.each(),在jQuery中:

$.each(myArray, function(key, value) {
    console.log(value);
});

_.each(),在Undercore.js中:

_.each(myArray, function(value, key, myArray) {
    console.log(value);
});

_.forEach(),在Lodash中:

_.forEach(myArray, function(value, key) {
    console.log(value);
});

最好使用顺序for循环:

for (var i = 0; i < myStringArray.length; i++) {
    // Do something
}