Question

删除对象数组中的元素

2017-02-07

135

javascript arrays

我需要删除对象数组中的元素，请查看我的数组：

我想删除 done == true 的元素，请查看我的脚本：

var items = [{text: "a", done: false}, {text: "b", done: false}, {text: "c", done: true}, {text: "d", done: true}, {text: "e", done: true}];


items.forEach((elem, index) => {
  if(items[index].done) {
    items.splice(index, 1);
  }
})

console.log(items)

但是它不起作用。

Answer 1

这不会起作用，因为您正在迭代和修改同一个数组。当您删除索引 1 处的元素时，索引 2 处的元素将成为索引 1，但您的 forEach 将继续迭代，并且不会检查新的索引 1

var items = [{text: "a", done: false}, {text: "b", done: false}, {text: "c", done: true}, {text: "d", done: true}, {text: "e", done: true}];

items = items.filter(function(elem){
    return !elem.done;
});

console.log(items);

Answer 2

var items = [{text: "a", done: false}, {text: "b", done: false}, {text: "c", done: true}, {text: "d", done: true}, {text: "e", done: true}]

console.log(items.filter(o => !o.done))

您的代码存在问题，因为您在迭代数组时修改了数组，因此当您删除一个元素时，所有元素都会移动，并且您会跳过下一个元素。

检查以下代码片段，以及您如何永远不会访问 (d) 元素：

var items = [{text: "a", done: false}, {text: "b", done: false}, {text: "c", done: true}, {text: "d", done: true}, {text: "e", done: true}]

var itemsCopy = [{text: "a", done: false}, {text: "b", done: false}, {text: "c", done: true}, {text: "d", done: true}, {text: "e", done: true}]

items.forEach((elem, index) => {
      if (itemsCopy[index].text !== items[index].text)
      console.log('you want to access', itemsCopy[index].text, 'instead you are accessing', items[index].text)
      if(items[index].done) {
        items.splice(index, 1);
        //elem.remove();
      }
  })

每次循环索引都会增加 1，因此当您删除 c 元素时（索引 2），索引将变为 3。但是由于您已删除 c ，因此现在您的数组如下所示：

[a, b, d, e]

因此，您访问的是元素 e ，而不是 d ，因为现在 d 的索引为 2