从数组中移除一个项目并将其添加到另一个数组

Question

我正在向用户展示一系列包含内容的div，用户可以将其从页面中移除，以便不再看到它。

我想将已删除的相同div内容添加到另一个数组中，该数组将用于填充下拉列表。

以下是我目前的代码：

//Remove function
removeCategory(index: number): void {
    this.categories.splice(index, 1);
}
//Array
categories: Array<Item> = [
    new Item(1, 'test1'),
    new Item(2, 'test2')
];
//New Array to add previous removed item
ddoptions: Array<object> = [];

在removeCategory函数中，splice之前是否可以执行push语句？我不确定应该传入什么参数，因为在这样做时会导致错误：

this.ddoptions.push(index);

- bluePearl

---

只需看一下splice返回的内容。上面的代码过于零散，无法准确告诉您应该将其放在哪里，但这已经足够让您明白了。 - T.J. Crowder

Answer 1

2020年更新

在更新的ES规范中，您还可以在数组上使用解构赋值运算符，这意味着您不必在给定上下文中使用concat或apply push函数了。尽管在我最初写这篇文章时已经存在，但现在更为常见。

this.ddoptions.push(...this.categories.splice(index, 1));

以下规则仍然适用，使用 push 和 splice 会改变现有数组，因此如果要保持不可变性，则应该仍然使用 concat。

---

原始回答

您可以直接将 splice 插入 push 方法中，因为 splice 返回已删除的对象。

this.ddoptions.push(this.categories.splice(index, 1)[0]);

splice方法实际上返回一个被移除的元素数组。在您的情况下，您只移除了一个元素，所以上面的代码有效。如果您要删除一个或多个元素，则可以使用几种方法将这些元素添加到第二个数组中。

通过使用concat生成新数组：

this.ddoptions = this.ddoptions.concat(this.categories.splice(index, 1));

这可能会导致问题，因为ddoptions不再是同一个对象。这取决于您正在做什么以及angular正在做什么。

您可以通过应用push原型将数组作为多个参数传递给push。

[].push.apply(this.ddoptions, this.categories.splice(index, 1));

以此方式，ddoptions将保持为同一数组，并将所有新元素推入其中。

- James Hay

---

这应该可以工作。虽然我认为第一个更适合他的需求。 - Reyan Tropia

Answer 2

Array#splice方便地返回包含已删除元素的数组：

removeCategory (index) {
  this.ddoptions.push( this.categories.splice(index, 1)[0] )
}

---

View TypeScript Demo

---

JavaScript Demo:

class Item {
  constructor(a, b) { return [a, b] }
}

class Example {
  removeCategory (index) {
    this.ddoptions.push( this.categories.splice(index, 1)[0] )
  }
  //Array
  categories = [
    new Item(1, 'test1'),
    new Item(2, 'test2')
  ]
  //New Array to add previous removed item
  ddoptions = []
}

var example = new Example()

example.removeCategory(1)

console.log(example.ddoptions)

- gyre

Answer 3

Splice返回已删除元素的数组。你可以添加一个数组大小的测试，以确保里面有一个元素。

//Remove function
removeCategory(index: number): void {
    var deletedElement = this.categories.splice(index, 1);
    ddoptions.push(deletedElement[0]);
}

- Quentin Morrier