如何使用JavaScript循环数组？

Question

我有一个字符串,其数据由管道符(|)分隔.

例

var somestring = "data1|data2|data3";
var separated = somestring.split("|");

我知道如何使用它split()来分隔每个数据.

但是,我不知道结果会有多少管道Array.

在jQuery或JavaScript中,如何循环返回的数组？

Answer 1

在jQuery或JavaScript中,如何遍历每个分离的变量？

你基本上只需要迭代结果Array.

jQuery的

$.each 环

该方法易于使用,并且在封装的变量中有益.

$.each(separated, function(index, chunk) {
    // `chunk` is each member of the array.
});

jsFiddle.

当然,jQuery 是 JavaScript,因此以下任何方法都可以使用.

JavaScript的

for 环

这是推荐的方式.

for (var i = 0, length = separated.length; i < length; i++) {
    var chunk = separated[i];
    // `chunk` is each member of the array.
}

jsFiddle.

您还会注意到length属性已缓存,因此在每次迭代时都不会查找.一些浏览器已经针对此进行了优化,但IE似乎仍然可以从缓存中受益.它只需要5秒钟,所以你也可以保持IE用户的快乐.

您可能需要定义i和chunk对外部for循环,因为JavaScript有没有块范围(除非你使用let),以及这些变量会存在(声明悬挂)之前和之后(没有块范围).

for ( in ) 环

通常不推荐使用此循环,因为它应该仅用于迭代对象属性,而不是像成员属性那样的数组.

for (var chunk in separated) {
     if ( ! separated.hasOwnProperty(chunk)) {
         continue;
     }
     // `separated[chunk]` is each member of the array.   
}

jsFiddle.

这个循环将遍历原型链上的所有属性,因此hasOwnProperty()必须使用.因此,建议不要使用数组.

for ( of ) 环

该循环在ECMA 6中标准化,并且能够循环遍历NodeLists和迭代器.

for (var chunk of separated) {
     // `chunk` is each member of the array.   
}

的jsfiddle

forEach() 方法

该方法是ECMA-262标准的补充.它在IE8中不可用,但它可以相对容易地填充.

separated.forEach(function(chunk, index) {
     // `chunk` is each member of the array.   
});

jsFiddle.

其他专业方法

如果您希望迭代特定目标,那么使用专门的迭代器可能会很有用.请记住,这些也没有最好的浏览器支持.

filter 方法

创建一个新的元素数组,相关的回调返回truthy.

separated.filter(function(element) {
    return +element > 255;
});

reduce 方法

基于从左到右减少数组元素创建新值.

separated.reduce(function(accumulator, element) {
    return accumulator.concat(element);
}, "");

另见reduceRight方法.

map 方法

创建一个新数组,用关联回调的返回值替换每个元素.

separated.map(function(element) {
    return element.substr(0, 1);
});

every 方法

返回一个布尔值,该值是传递测试的数组中每个元素的结果.这种方法短路,即只要一个元素的回调没有返回真值,它就会返回.

separated.every(function(element) {
    return element.substr(0, 1) == "a";
});

some 方法

返回一个布尔值,该值是传递测试的数组中某个元素的结果.此方法短路,即每当一个元素的回调通过测试时它返回.

separated.some(function(element) {
    return element.substr(0, 1) == "a";
});