-

JS 数组遍历总结

WEB前端

JS 数组用于在单一变量中存储多个值。在Web前端开发,数组的使用是非常普遍的,使用数组合理的设计,可以让业务更清晰,也会提高开发效率。而使用数组就避免不了使用遍历数组。下面雷雪松就总结一下JS 数组遍历。

1、Array.forEach()
forEach() 方法为每个数组元素调用一次函数(回调函数), forEach()没有返回值。函数传入三个参数:数组当前项的值、数组当前项的索引和数组对象本身。
[cc lang=”javascript” escaped=”true”]let arr = [‘a’, ‘b’, ‘c’];
arr.forEach((item, index, arr) => {
console.log(item)
})
[/cc]

2、Array.map()
map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一次提供的函数后的返回值。函数传入三个参数:数组当前项的值、数组当前项的索引和数组对象本身。
[cc lang=”javascript” escaped=”true”]let arr = [1,2,3];
let newArr =  arr.map((item, index, arr) => {
return item *2
})
console.log(arr) // [1,2,3];
console.log(newArr) //[2,4,6];
[/cc]

3、Array.filter()
filter() 方法创建一个新数组, 其结果是通过所提供函数实现的测试的所有元素。 函数传入三个参数:数组当前项的值、数组当前项的索引和数组对象本身。
[cc lang=”javascript” escaped=”true”]let arr = [‘a’, ‘b’, ‘c’];
let newArr =  arr.filter((item, index, arr) => {
return item ===”a”
})
console.log(arr) // [‘a’, ‘b’, ‘c’];
console.log(newArr) //[‘a’];
[/cc]

4、Array.some()
some() 方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个布尔值。函数传入三个参数:数组当前项的值、数组当前项的索引和数组对象本身。
[cc lang=”javascript” escaped=”true”]let arr = [‘a’, ‘b’, ‘c’];
let isHasA=  arr.some((item, index, arr) => {
return item ===”a”
})
console.log(isHasA) // true
[/cc]

5、Array.every()
every() 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。函数传入三个参数:数组当前项的值、数组当前项的索引和数组对象本身。
[cc lang=”javascript” escaped=”true”]let arr = [‘a’, ‘b’, ‘c’];
let isAllA=  arr.every((item, index, arr) => {
return item ===”a”
})
console.log(isAllA) // false
[/cc]

6、Array.reduce()
reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。函数接受四个参数:accumulator 累计器、currentValue 当前值、currentIndex 当前索引和array 数组。
[cc lang=”javascript” escaped=”true”]let arr = [1,2,3];
let sum=  arr.reduce((total,item,index,arr) => {
return total + item
})
console.log(sum) // 6
[/cc]

7、Array.reduceRight()
reduceRight() 方法接受一个函数作为累加器(accumulator)和数组的每个值(从右到左)将其减少为单个值。函数接受四个参数:accumulator 累计器、currentValue 当前值、currentIndex 当前索引和array 数组。
[cc lang=”javascript” escaped=”true”]let arr = [1,2,3];
let sum=  arr.reduceRight((total,item,index,arr) => {
return total + item
})
console.log(sum) // 6
[/cc]

8、Array.find()

find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。函数传入三个参数:数组当前项的值、数组当前项的索引和数组对象本身。

[cc lang=”javascript” escaped=”true”]let arr = [1,2,3];
let found=  arr.find((item, index, arr) => {
return item === 1
})
console.log(found) // 1
[/cc]

来源:JS 数组遍历总结

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注