关于js中常用数组遍历方法的分类与复用问题

先说结论:

结论一：

按是否一定遍历完数组全部元素可将数组遍历方法分为两大类：

第一类：一定会遍历数组所有元素：forEach map filter reduce

第二类：断言函数：,不会从头遍历到尾,而是找到目标则停止.即首次return ture/false即停止：find findindex some every(false)

结论二：

上述同类遍历方法中，虽然看起来遍历规则相同，但js为每个方法都定义了独特的返回参数与用法，不能随意复用

前言：

js为我们提供了几种常用遍历方法，这些方法在实现具体功能时，往往与其中的回调函数配合使用，除了遍历数组为回调函数提供实参这种基本功能外，均封装了各自独特的功能。下面通过举例逐步探究：

举例：

例一：map

    <script>
        var arr = [4,5,6,7,8]
        var a = arr.map(function(v,i){
        console.log(v,i)  //用于观察遍历过程
            return v*2;
        })
        console.log(arr)
        console.log(a)
    </script>

控制台输出结果：

结论：map的作用即为遍历数组所有元素，forEach，filter同理，不做单独讨论

例二：reduce

    <script>
    var ages = [3, 10, 18, 20];
    var sum = ages.reduce(function(x, y){
      console.log(x,y)  //观察数组遍历过程
      return x + y
    }, 0)
    console.log(sum);
    </script>

控制台输出结果：

结论：reduce的作用为遍历所有数组元素且返回计算结果

例三：find

    <script>
        var arr1 = [3, 20, 10, 18];
        var arr2 = [3, 10, 18, 20];
        var a = arr1.find(function (v, i) {
            console.log(v, i);
            return v > 18;
        });
        console.log(a);

        console.log('----------')

        var b = arr2.find(function (v, i) {
            console.log(v, i);
            return v > 18;
        });
        console.log(b);
    </script>

在控制台输出结果：

结论：与第一类不同，第二类方法在遇到返回值为ture (every方法是false) 时会直接跳出循环，但若没有遇到返回值ture，当然也可遍历完数组的所有元素

例四：map与filter

    <script>
        var arr = [4,5,6,7,8]

        var a = arr.map(function(v,i){
        console.log(v,i)  //用于观察遍历过程
            return v*2;
        })
        console.log(arr)
        console.log(a)

        console.log('----------')

        var b = arr.filter(function(v,i){
        console.log(v,i)  //用于观察遍历过程
            return v*2;
        })
        console.log(arr)
        console.log(b)

        console.log('--------------------')

        var c = arr.filter(function(v,i){
            console.log(v,i)  //用于观察遍历过程
            return v <= 5
        })
        console.log(c)

        console.log('----------')

        var d = arr.map(function(v,i){
            console.log(v,i)  //用于观察遍历过程
            return v <= 5
        })
        console.log(d)
    </script>

结论：用map无法实现filter，反过来亦如此

总结：

如例一到例三可知：受限于功能的不同，有些遍历一定能遍历全部元素，而其他遍历方法的遍历元素个数取决于便利的数组元素属性值。

但即使是同一类元素，也不可随意复用。如例四：即使map与filter均可遍历数组的全部元素，但由于js底层封装时赋予的功能不同，只能各司其职，无法互相复用实现互相的功能