【无标题】

数组遍历

for循环

for循环可以用于处理任何遍历或迭代的需要。并且可以在指定条件下中断循环。缺点是它需要显式地管理循环的索引和条件，比较繁琐。

const fruits = ["Apple", "Banana", "strawberry", "tangerine", "durian"]

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

forEach

forEach专门用于遍历数组，直接访问当前元素和索引。缺点是不可以中断，当不需要进行中断时，forEach是很好的选择。

const fruits = ["Apple", "Banana", "strawberry", "tangerine", "durian"]

arr.forEach((item, index) => {
   
  console.log(item, index);
})

for…of

for...of 是ES6新增的方法，可以用于直接访问数组中每个元素的值，并且可以配合break、continue、 throw等语句提前结束循环。

缺点是无法获取索引，如果你想获取索引，使用for循环或者forEach更合适。

const fruits = ["apple", "banana", "strawberry", "tangerine", "durian"]

for (let fruit of fruits) {
  console.log(fruit); // apple banana
  if (fruit === 'banana') {
    break
  }
}

此外，for...of 还可以用于遍历字符串、Map、Set等。

const str = 'apple'

for (let key of str) {
  console.log(key) // a p p l e
}

filter

该方法会过滤数组中的项，返回一个新数组，该新数组由所有执行函数后返回true的元素组成。

const arr = [1, 2, 3, 4, 5];
const newArr = arr.filter(num => num > 3)

console.log(newArr) // [ 4, 5 ]

map

map方法主要用于运行指定的函数获取一个新数组，该方法不会改变原数组，如果你不想改变原数组，又想对元素进行处理后拿到一个新数组，可以选择用map。

const arr = [1, 2, 3, 4, 5]

const newArr = arr.map((value, index) => {
   
  return value * 2
}) 

console.log(newArr) // [ 2, 4, 6, 8, 10 ]

reduce

reduce方法主要用于将数组中每个元素执行完指定的函数后，输出一个最终的结果。reduce的使用场景有很多，比如求和、求积、找最大值和最小值，或者将数组元素转成一个对象等。并且reduce方法不会改变原来的数组。

reduce的接受两个参数，第一个参数为执行的函数，第二个参数为累加器的初始值。具体实现如下：

求和

let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce((accumulator, num) => {
   
    return accumulator + num
}, 10)

console.log(sum); // 15

求最大值

let numbers = [5, 3, 9, 8, 4, 2];
let max = numbers.reduce((accumulator, value) => Math.max(accumulator, value)); 

console.log(max); // 9

上面的accum