其他分享
首页 > 其他分享> > js中数组常用的API(二)之迭代函数

js中数组常用的API(二)之迭代函数

作者:互联网

有时,我们需要迭代数组中的元素,可以使用for循环进行迭代。不过,数组自带了很多迭代方法,方便我们调用。
这些迭代函数的第一个参数是一个函数,这个函数可以带三个参数,分别表示数组元素、数组的索引和数组本身。

every(function (element, index, array){

}) 

1、every

every函数是测试该数组的元素是否都满足某个条件。
返回值:都满足,返回true,只要有一个不满足,则返回false

        let numArr = [1, 343, 123, 5, 7]
        let ood = numArr.every(function (element) {
            return element %2 !== 0
        })
        console.log(ood) // true

        let than100 = numArr.every(function (element) {
            return element > 100
        })
        console.log(than100) // false

说明:let ood = numArr.every() 这条语句是判断数组中的所有元素是否都是奇数,若都是奇数则返回true; let than100 = numArr.every() 这条语句是判断数组中的所有元素是否都大于100。
every函数在迭代过程中,只要有一个为false就会中止迭代,返回false.

2、some

some迭代函数是测试数组中的元素是否至少有一个满足条件。
返回值:有一个满足条件,则返回true;若都不满足条件,则返回false

        let than100 = numArr.every(function (element) {
            return element > 100
        })
        console.log(than100) // false

        let than100_2= numArr.some(function (element) {
            return element > 100
        })
        console.log(than100_2) // true

可以看到,同样的条件,使用some方法时,函数返回true

every和some函数的区别

every函数的意思类似于数学上任意一个
some函数的意思类似于数学上的至少存在一个
every方法是数组中的任意一个元素都要满足条件才返回true;
some方法是数组中至少存在一个元素满足条件,就返回true。

3、map

map方法:处理数组中的每个元素,然后将其返回值组成一个新的数组

        let numArr = [1, 2, 3, 4, 5]
        let numSquareArr = numArr.map((element) => {
            return Math.pow(element, 2)
        })
        console.log(numSquareArr) // [1, 4, 9, 16, 25]

4、filter

filter方法:类似于数据库中的select查询语句,将满足条件的元素组成一个新数组返回。

        let ageArr = [18, 4, 60, 30, 45, 12]
        let adult = ageArr.filter((element) => {
            return element >= 19
        })
        console.log(adult) // [60, 30, 45]

5、reduce

参数说明:
previousValue: 前一个值
currentValue: 当前的值
currentIndex: 当前元素的索引
array: 数组本身
其中,currentIndex和array是可选的参数,如果用不到它们,可以不传。
这个函数会返回一个将被叠加到累加器的值,initialValue参数是累加器的初始值,reduce停止执行后会返回这个累加器。

// Arrow function
reduce((previousValue, currentValue) => { … } )
reduce((previousValue, currentValue, currentIndex) => { … } )
reduce((previousValue, currentValue, currentIndex, array) => { … } )
reduce((previousValue, currentValue, currentIndex, array) => { … }, initialValue)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>reduce方法</title>
</head>
<body>
    <script>
        let arr1 = [1, 2, 3,4, 5, 8]
        let sum = arr1.reduce((previousValue, currentValue) => {
            return previousValue + currentValue
        }, 10)
        console.log(sum) // 33
    </script>
</body>
</html>

这是一个求数组和的功能,不过,我特意将sum的初始值设置为10,所以结果为33.

6、forEach

forEach:能迭代整个数组,它没有返回值,和for循环的功能类似。不过,貌似for循环的效率更高。

        let foodPrice = [10, 30, 23, 5, 60]
        foodPrice.forEach((element) => {
            console.log(element)
        })
``
`

标签:迭代,element,API,let,数组,numArr,every,js
来源: https://blog.csdn.net/zhang_cherry/article/details/120688966