从数组中删除元素，使用slice函数

Question

我正在尝试使用slice从数组中删除一个元素，但我无法使其工作，请看这段代码。

    console.log(this.activeEffects); // Prints my array
    console.log(this.activeEffects.slice(0,1)); // Remove from index 0, and remove one.
    console.log(this.activeEffects); // Prints array again, this time my element should be gone

这个的结果是。

所以从中得到的是，一开始数组是完整的，就像应该的那样。然后打印出了被切片的数组部分。最后第三个应该是空的？还是？

- MartinElvar

---

能否为此创建一个 JSFiddle？ - zb'

你确定这是一个数组吗？ - Ashwin Prabhu

Answer 1

function removeItemWithSlice(index) {
  return [...items.slice(0, index), ...items.slice(index + 1)]
}

Slice会创建一个新的数组。我们创建两个数组：从开头到索引和从索引+1到结尾。然后，我们使用展开运算符(...)获取这些数组的项并创建一个包含所有所需项的新单个数组。如果您不喜欢一行代码的写法，我将贴出等效的另一种方法：

function removeItemWithSlice(index) {
  const firstArr = items.slice(0, index);
  const secondArr = items.slice(index + 1);
  return [...firstArr , ...secondArr]
}

- corlaez

---

这应该是被接受的答案，因为它解决了字面上的问题。当涉及到变异时，Splice和Slice的行为不同。 - Jesse Hattabaugh

Answer 2

我相信你正在寻找splice。 来自W3 Schools：

splice() 方法向数组添加/移除项目，并返回已删除的项目。

看一下该页面上的示例；那里的用例与您想要实现的类似。

编辑：Nicosunshine建议的备用链接到MDN，该命令有更多的信息。

- TSL

---

我知道我可能听起来有点烦人，但请不要使用W3 Schools。 MDN是一个更好的资源，https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/splice - nicosantangelo

谢谢TSL，这解决了我的问题。我现在自己打自己耳光。 - MartinElvar

请@nicosunshine向Meta请求自动屏蔽w3schools链接！ - canon

@canon 我不知道那是否可行，但你可以在所有的Stack Overflow上垃圾邮件http://w3fools.com/ :P - nicosantangelo

OP请求获取切片。如果您不想改变值，使用切片是有原因的。 - Emobe

是的，但是OP在他们的示例中的评论表明splice的用例。 - TSL

Answer 3

a.slice(0, index).concat(a.slice(index + 1))

- spirinvladimir

---

最好不要向提问者(OP)抛出代码片段，更好的做法是给予一些额外的解释，例如为什么他们的解决方案不起作用，你的解决方案如何运作，以及可能链接到所使用的函数的其他文档。 - kingdaro

我的思维方式适用于一个优秀的开发者。 - spirinvladimir

从技术上讲，这是正确的答案 - 是的，你可能想使用splice :-) - sekmo

Answer 4

.slice 方法不会改变数组，你可以使用 .splice() 方法来删除数组中索引为 i 的元素：

this.activeEffects.splice(i, 1)

- Esailija

---

但是我可能需要在数组中间删除一个元素。 - MartinElvar

@MartinElvarJensen 对，我没有意识到这一点。当你想从开头删除时，shift() 是更好的选择。 - Esailija

slice方法并不像它所说的那样改变原始数组，而是返回被删除的元素。那么为什么不通过赋值将原始数组替换为已删除的元素呢？例如：this.activeEffects = this.activeEffects.slice(0,1) - mbx-mbx

@Magrangs，你需要将其反转。类似这样：this.activeEffects = this.activeEffects.slice(1) 它会创建一个新数组，除了第一个元素外，其他所有元素都存在其中。但是如果旧数组有其他引用，它们不会被更新。 - Esailija

Answer 5

这是我能想到的内容：

这是我能想到的内容：

var newArray = oldArray.slice(indexOfElementToRemove+1).concat(oldArray.slice(0,indexOfElementToRemove));

- Chacal

---

这会改变数组的顺序。 - tladuke

Answer 6

Array.prototype.slice()...

不会改变原始数组，而是返回一个新的“一级深度”副本，其中包含从原始数组中切片的元素的副本。原始数组的元素被复制到新数组中，如下所示：

而 Array.prototype.splice()...

更改数组的内容，添加新元素并删除旧元素。

这个例子应该说明了区别。

// sample array
var list = ["a","b","c","d"];
// slice returns a new array
console.log("copied items: %o", list.slice(2));
// but leaves list itself unchanged
console.log("list: %o", list);
// splice modifies the array and returns a list of the removed items
console.log("removed items: %o", list.splice(2));
// list has changed
console.log("list: %o", list);

- canon

Answer 7

看这里： http://www.w3schools.com/jsref/jsref_slice_array.asp 你可以看到slice方法选择对象并将它们放入一个新的数组对象中^^所以你不能像这样删除一个对象，也许你可以尝试这样做：

var a = ["a","b","c"]; (pseudo code)
/* I wan't to remove the "b" object */

var result = a.slice(0,1)+a.slice(2,1); /* If you considers that "+" is a concatenation operator, i don't remember if it is true... */

- BlackMario