在 JavaScript 中循环迭代数组的方法有很多种。抽时间简单的归纳一下,我们先从经典的方法开始,然后转向新标准提供的方法。
while 语句只要指定的条件求值为
,就会一直执行它的语句块。
- true
- // 语法
- while (condition)
- statement
条件检测
会在每次
- condition
执行之前发生。如果条件返回为真,
- statement
会被执行并紧接着再次测试条件。如果条件返回为假,执行将停止并把控制权交回给
- statement
后面的语句。
- while
- let index = 0;
- const array = [1, 2, 3, 4, 5, 6];
- while (index < array.length) {
- console.log(array[index]);
- index++;
- }
for 循序语句可以说是 JavaScript 中最经典的循序语句了。for 循环会一直重复执行,直到指定的循环条件为fasle。 JavaScript的for循环和Java与C的for循环是很相似的。
- // 语法
- for ([initialExpression]; [condition]; [incrementExpression])
- statement
当一个for循环执行的时候,会发生以下事件:
,它将被执行。这个表达式通常会初始化一个或多个循环计数器,但语法上是允许一个任意复杂度的表达式的。这个表达式也可以声明变量。
- initialExpression
表达式的值。如果
- condition
的值是
- condition
,循环中的
- true
会被执行。如果
- statement
的值是
- condition
,
- false
循环终止。如果
- for
表达式整个都被省略掉了,
- condition
的值会被认为是
- condition
。
- true
被执行。如果需要执行多条语句,可以使用块
- statement
来包裹这些语句。
- ({ ... })
,执行它,然后流程回到步骤2。
- incrementExpression
- const array = [1, 2, 3, 4, 5, 6];
- for (let index = 0; index < array.length, index++) {
- console.log(array[index]);
- }
forEach() 方法用数组中的每个元素调用一次提供的回调函数。
- // 语法
- array.forEach(callback(currentValue, index, array){
- //do something
- }, this)
- array.forEach(callback[, thisArg])
forEach 方法按升序为数组中含有效值的每一项执行一次
函数,那些已删除(使用delete方法等情况)或者未初始化的项将被跳过(但不包括那些值为 undefined 的项)(例如在稀疏数组上)。forEach() 为每个数组元素执行callback函数;不像
- callback
或者
- map()
,它总是返回
- reduce()
值,并且不可链式调用。
- undefined
- const array = [1,2,3,4,5,6];
- array.forEach(function(current_value, index, array) {
- console.log(`At index ${index} in array ${array} the value is ${current_value}`);
- });
- // => undefined
ES6 中很多新的对象(如:
,
- Map
,
- Set
等)都有
- TypedArray
方法,实用起来类似,具体可以查阅相关资料。
- forEach()
map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
- // 语法
- let array = arr.map(function callback(currentValue, index, array) {
- // Return element for new_array
- } [, thisArg])
map() 会返回一个新数组,每个元素都是回调函数的结果。map 不修改调用它的原数组本身。
- const array = [1,2,3,4,5,6];
- const square = x => Math.pow(x, 2);
- const squares = array.map(square);
- console.log(`Original array: ${array}`);
- console.log(`Squared array: ${squares}`);
reduce() 方法对累加器和数组中的每个元素 (从左到右)应用一个函数,将其减少为单个值。
- // 语法
- array.reduce(function callback(accumulator, currentValue, currentIndex, array)[, initialValue])
reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:
回调函数第一次执行时,
和
- accumulator
的取值有两种情况:调用
- currentValue
时提供
- reduce
,
- initialValue
取值为
- accumulator
,
- initialValue
取数组中的第一个值;没有提供
- currentValue
,
- initialValue
取数组中的第一个值,
- accumulator
取数组中的第二个值。
- currentValue
注意: 不提供
,
- initialValue
会从索引1的地方开始执行
- reduce
方法,跳过第一个索引。提供
- callback
,从索引0开始。如果数组为空并且没有提供initialValue, 会抛出TypeError 。
- initialValue
- const array = [1,2,3,4,5,6];
- const sum = (x, y) => x + y;
- const array_sum = array.reduce(sum, 0);
- console.log(`The sum of array: ${array} is ${array_sum}`);
filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
- // 语法
- var new_array = arr.filter(callback[, thisArg])
filter 为数组中的每个元素调用一次 callback 函数,并利用所有使得 callback 返回 true 或 等价于 true 的值 的元素创建一个新数组。callback 只会在已经赋值的索引上被调用,对于那些已经被删除或者从未被赋值的索引不会被调用。那些没有通过 callback 测试的元素会被跳过,不会被包含在新数组中。
- const array = [1,2,3,4,5,6];
- const even = x => x % 2 === 0;
- const even_array = array.filter(even);
- console.log(`Even numbers in array ${array}: ${even_array}`);
every() 方法测试数组的所有元素是否都通过了指定函数的测试。
- // 语法
- arr.every(callback[, thisArg])
every 方法为数组中的每个元素执行一次 callback 函数,直到它找到一个使 callback 返回 false(表示可转换为布尔值 false 的值)的元素。如果发现了一个这样的元素,every 方法将会立即返回 false。否则,callback 为每一个元素返回 true,every 就会返回 true。callback 只会为那些已经被赋值的索引调用。不会为那些被删除或从来没被赋值的索引调用。
- const array = [1, 2, 3, 4, 5, 6];
- const under_seven = x = >x < 7;
- if (array.every(under_seven)) {
- console.log('Every element in the array is less than 7');
- } else {
- console.log('At least one element in the array was bigger than 7');
- }
some() 方法测试数组中的某些元素是否通过由提供的函数实现的测试。
- // 语法
- arr.some(callback[, thisArg])
some 为数组中的每一个元素执行一次 callback 函数,直到找到一个使得 callback 返回一个“真值”(即可转换为布尔值 true 的值)。如果找到了这样一个值,some 将会立即返回 true。否则,some 返回 false。callback 只会在那些”有值“的索引上被调用,不会在那些被删除或从来未被赋值的索引上调用。
- const array = [1, 2, 3, 9, 5, 6, 4];
- const over_seven = x = >x > 7;
- if (array.some(over_seven)) {
- console.log('At least one element bigger than 7 was found');
- } else {
- console.log('No element bigger than 7 was found');
- }
这篇文章只是简单的归纳 JavaScript 中循环迭代数组的一下语句和方法,具体方法的信息请查阅相关文档。
来源: http://www.css88.com/archives/7944