处理数组循环中删除元素导致索引错位情况

这个标题有点绕，可能有些人会看不懂，那么我来解释下这个标题。

就是很多时候我们对一个数组进行操作的时候，在for遍历的过程中删掉了一个元素，那么在删掉那个元素之后的所有元素的索引值都会减少一位，数组长度缩短一位，删完之后，正在进行的循环会继续循环下去，但是循环的索引不变，就会导致被删元素紧邻的后面那个元素跳过了循环检查。代码解释如下：

var arr=[1,2,3,3,4,5,6];
for(let i=0,len=arr.length;i<len;i++){
    if(arr[i]===3){
        arr.splice(i,1);
        console.log("抓到一个3");
    }
}

这个程序的意思就是在数组arr找出3来并把它删除，但是结果只打印了一次“抓到一个3”，就是说它只找到一个，而另外一个去哪了？请听下面分享。

循环从第一位开始检，找到3之后立马打印“抓到一个3”，此时的索引是2
[1,2,3¹,3²,4,5,6]
而它后面那个3因为前面删掉一个，会往左挪一位，从索引3变成索引2了，而循环继续检查是从索引3开始，即对应数组中的4，直到结束。
[1,2,3²,4,5,6]
所以第二个3是被漏掉了。

怎么解决这种问题呢？最好的办法是逆向循环(从数组的最后一位开始检查，直到数组的头部)：

var arr=[1,2,3,3,4,5,6];
for(let len=arr.length,i=len-1;i>0;i--){
    if(arr[i]===3){
        arr.splice(i,1);
        console.log("抓到一个3");
    }
}

这样就可以打印出两次"抓到一个3"。如果你一味地想怎么把循环中的索引往回扳一位，这就显得非常复杂了。有时候逆向思维真的很好用。

文章作者： “秋了秋”个人博客，本站鼓励原创。

目录: 前端编程标签: 数组循环 7520次阅读