JavaScript实现按ID数值而非索引删除数组元素的DeleteByID函数求助

嘿，我来帮你搞定这个删除数组元素的问题！先看看你代码里的几个小问题，然后给你两种靠谱的解决方案。

你的代码里的错误点： #

• 用for...in遍历数组不合适：for...in主要用来遍历对象的属性，虽然能遍历数组索引，但会把数组原型链上的可枚举属性也列出来，容易出意外。遍历数组更推荐用普通for循环、for...of或者数组内置方法。
• 错误调用splice方法：你写的todos[i].splice(i, id)是错的——splice是数组的方法，不是数组里单个对象的方法！而且splice的第二个参数是要删除的元素数量，不是id值，应该传1。
• 函数没有返回值：你的deleteByID函数没有return任何内容，所以console.log("Delete:", deleteByID(2))会打印Delete: undefined，这不是你想要的结果。

解决方案1：用Array.filter()（最简洁推荐） #

filter方法会返回一个新数组，包含所有符合条件的元素，我们只需要过滤掉id匹配的元素就行。如果需要修改原数组，直接把新数组赋值给原变量即可：

let todos = [ 
  {id: 1, todo: "learning javascript"}, 
  {id: 2, todo: "sleeping"}, 
  {id: 3, todo: "playing"} 
];

function deleteByID(id) {
  // 过滤出id不等于目标id的元素，重新赋值给原数组
  todos = todos.filter(item => item.id !== id);
}

// 执行删除
deleteByID(2);
// 查看结果
console.log(todos);
// 输出：[{id: 1, todo: "learning javascript"}, {id: 3, todo: "playing"}]

这个方法的好处是代码简洁，而且不会因为索引错乱出问题，适合大多数场景。

解决方案2：用普通for循环修改原数组 #

如果你不想创建新数组，想直接修改原数组，可以用倒序的for循环（避免删除元素后索引偏移）：

let todos = [ 
  {id: 1, todo: "learning javascript"}, 
  {id: 2, todo: "sleeping"}, 
  {id: 3, todo: "playing"} 
];

function deleteByID(id) {
  // 倒序遍历数组，这样删除元素后不会影响前面的索引
  for (let i = todos.length - 1; i >= 0; i--) {
    if (todos[i].id === id) {
      // 从索引i开始，删除1个元素
      todos.splice(i, 1);
      break; // 如果id是唯一的，找到后就退出循环
    }
  }
}

// 执行删除
deleteByID(2);
// 查看结果
console.log(todos);

倒序遍历的原因是：如果正序遍历，删除某个元素后，后面的元素会往前移一位，导致下一个索引的元素被跳过，倒序就不会有这个问题。

内容的提问来源于stack exchange，提问作者Firsty Ukhti Molyndi