JavaScript数组的循环和迭代

JavaScript数组的循环和迭代

循环

for循环

普通版for循环

var arr = ["a","b","c","d"];

for (let i = 0; i < arr.length; i++){
      console.log(arr[i]);    .//a b c d
}

优化版for循环

var arr = ["a","b","c","d"];

for (let i = 0; len =  arr.length;i < len;  i++){
      console.log(arr[i]);    .//a b c d
}

for in 循环

var arr = ["a","b","c","d"];

for (let i in arr ){
      console.log(arr[i]);    .//a b c d
}

for of 循环

var arr = ["a","b","c","d"];

for (let item of arr){
      console.log(item);    .//a b c d
}

说明

1. for-in 是遍历集合对象的键名， for-of 是直接遍历集合对象的键值。
2. for-of 的遍历方式性能要高于 for-in ，但仍比不不上普通的 for 循环。
3. for-of 不仅支持数组的遍历，还支持大多数类数组对象。同时也支持 ES6 里新增的 Map 和 Set 对象

数组迭代

forEach()

描述：按顺序让数组中每一项依次执行某种相同的操作。

var arr = [10, 11, 12,13, 14];

arr.forEach(function(item, index){
      console.log( item);           //10 11 12 13 14
      console.log( index);         //0 1 2 3 4
})    

说明：

1. 数组自带的 forEach 循环，使用频率较高，但实际上性能比普通 for 循环弱。

forEach 不能使用 continue 和 break 语句句中断循环，也不能使用 return 语句句返回到外层函 数。

map()

描述：按顺序让数组中每一项依次执行某种相同的操作，然后返回一个新数组

var arr = [10, 11, 12,13, 14];

var newArr = arr.map(function(item, index){
      return item * 2;
})
console.log( newArr);           //[20, 22, 24, 26,28]

filter()

描述：按顺序让数组中每一项依次执行某种相同的操作，然后筛选出符合条件的元素，组成新数组并返回。

var arr = [10, 11, 12,13, 14];

var newArr = arr.filter(function(item, index){
      return item % 2 == 0;
})
console.log( newArr);           //[10, 12, 14]

feduce()

描述：按顺序让数组中的前项和后项做某种计算，并累计返回最终值。

var arr = [10, 11, 12,13, 14];

var result = arr.reduce(function(prev, next){
      return prev + next;
})
console.log( result);           //  60

every()

描述：按顺序让数组中每一项依次执行某种相同的操作，用来检测数组中每一项是否都符合条件。

var arr = [10, 11, 12,13, 14];

var result = arr.every(function(item, index){
      return item % 2 == 0;
})
console.log( result);           //  false

说明：检测的元素中，如果全部都满足条件，返回 true ，只要有一项不满足条件，则返回 false 。即 一假必假。

some()

描述：按顺序让数组中每一项依次执行某种相同的操作，用来检测数组中某一项是否都符合条件。

var arr = [10, 11, 12,13, 14];

var result = arr.some(function(item, index){
      return item % 2 == 0;
})
console.log( result);           //  true

说明：检测的元素中，只要有一项符合条件，就返回结果 true ，如果全部都不满足条件，则返回结 果 false 。即一真必真。