js数组批量删除遇到的坑

var data = ["a","b","c","d","e","f","g"];
data.splice(1,1);
console.log(data);

上面这段代码表示删除了b元素
控制台打印：[“a”,“c”,“d”,“e”,“f”,“g”]，成功删除了b元素，这种是单删除

要是批量删除呢！

var data = ["a","b","c","d","e","f","g"];
for(var a=0;a<data.length;a++){
	if(data[a]==="b" || data[a]==="c"){
		data.splice(a,1);
	}
}
console.log(data);

上面这段代码表示想要删除b和c元素
但是控制台打印：[“a”, “c”, “d”, “e”, “f”, “g”]，发现c没被删除掉。

原因是：执行一次splice，原数组就被更改过了，索引数组的索引重新排列整齐，这样我们记录的老的排列索引就对不上了。

解决方法一：用逆向循环

var data = ["a","b","c","d","e","f","g"];
for(var a=data.length-1;a>=0;a--){
    if(data[a]==="b" || data[a]==="c"){
        data.splice(a,1);
    }
}
console.log(data);

控制台输出：[“a”, “d”, “e”, “f”, “g”]，成功批量删除了b和c

解决方法二：用filter

var data = ["a","b","c","d","e","f","g"];
data = data.filter(item=>item!=="b" && item!=="c");
console.log(data);

控制台输出：[“a”, “d”, “e”, “f”, “g”]，成功批量删除了b和c