使用切片或传播从JavaScript中删除数组中的元素

Question

我一直在观看Dan Abramov 避免阵列突变的 redux上的视频,我已经研究了如何使用sliceid从数组中删除元素,返回没有变异的新数组.

var arrayOld = ['apple', 'orange', 'fig']
var index = arrayOld.indexOf('orange')
var arrayNew = arrayOld.slice(0,index).concat(arrayOld.slice(index + 1))
// ['apple', 'fig']

我想知道如何使用es6 spread语法来做同样的事情？

另外我想知道为什么没有更简单的方法:例如es6中的辅助函数来执行此操作,就像concat方法一样简单,您可以只传入要移除的元素的id并返回新的数组,所以基本上拼接但没有突变.

Answer 1

你为什么不过滤它？

console.log(['apple', 'orange', 'fig'].filter(item => item !== 'orange'));
// [ 'apple', 'fig' ]

这将返回一个新数组,只包含满足谓词函数的元素.

注意:这不能用于仅删除一个元素,或仅删除特定索引处的元素.如果是这种情况,你可以这样做

var index = arrayOld.indexOf('orange')
console.log(arrayOld.filter((item, idx) => idx !== index));

传递给谓词函数的第二个参数是数组中元素的实际索引.

Answer 2

正如@thefourtheye已经提到的那样,最好用.filter你的例子.

但是,如果要使用扩展运算符通过索引删除元素,可以执行以下操作:

```

let arrayOld = ['apple', 'orange', 'fig']
let index = 1;
let arrayNew = [...arrayOld.slice(0, index), ...arrayOld.slice(index + 1)];

```