在数组中的forEach()方法中使用splice()方法删除数组元素带来的隐患(js)

问题描述:Array.forEach()中调用splice()方法删除数组元素带来的问题。

题目:移除数组 arr 中的所有值与 item 相等的元素。不要直接修改数组 arr,结果返回新的数组

示例
 输入:
 [1, 2, 3, 4, 2], 2
 输出:
 [1, 3, 4]
    //错误代码
 function remove(arr, item) {
        var newarr=[];
        arr.forEach(function(element,index){

            if(element==item){
                console.log(arr.splice(index,1));//错误
                //console.log(index);
            }else{
                newarr.push(element)
            }
        })
        return newarr;
    }
    console.log(remove([1,2,3,1],1));
    //正确代码
     function remove(arr, item) {
        var newarr=[];
        arr.forEach(function(element,index){

            if(element!=item){
             
                newarr.push(element)
            }
        })
        return newarr;
    }
    console.log(remove([1,2,3,1],1));

问题解析:

经过运行可以发现错误代码运行后,输出的数组为:[3]。
而正确的代码运行后,输出的结果是[2,3]
是因为arr.splice(index,1);删除数组元素后会改变原数组。
其执行过程如下:
forEach()第一次循环,寻找数组中的第一个元素,发现arr[0]==1后,立即执行删除操作,数组arr变成[2,3,1];
forEach()第二次循环,寻找数组中的第二个元素即arr[1],而此时我们发现arr[0]并没有被遍历到,也就因此newarr数组中缺少了2这个元素;

你可能感兴趣的:(js)