如何正确删除JavaScript对象数组中的指定元素？

我使用如下代码更新JS对象内的指定属性：

var main = {
          items: [
                  {
                    "name": "T-Shirt",
                    "description": "Green XL",
                    "quantity": "1",
                  },
                  {
                    "name": "Shoes",
                    "description": "Running, Size 10.5",
                    "quantity": "2",
                  }
                ]
        };

let project = main.items.find((p) => {
    return p.name === 'Shoes';
});

project.quantity = '3';
console.log(main); //shoes quantity is now 3

这段代码可以正常运行，但我还需要能够删除整个project对应的条目（比如示例中名为Shoes的整个对象块）。我尝试了如下写法：

let project = main.items.find((p) => {
    return p.name === 'Shoes';
});
delete project;

console.log(main); //shoes still exist

但代码并未生效，运行后Shoes条目仍然存在。请问删除该类属性的最佳实现方式是什么？
补充说明：我当时的核心问题是如何找到待删除元素对应的index。

你之前的写法不生效，是因为delete project只是删除了project这个局部变量的绑定，该变量存储的是原数组中目标对象的引用，delete操作仅能删除对象属性或变量绑定，无法直接删除数组元素，因此原数组里的目标条目会完整保留。

以下是两种常用的实现方案：

方案1：通过findIndex定位下标后删除（修改原数组） #

和find用法完全一致的findIndex方法可以直接拿到目标元素的下标，找不到时返回-1，确认下标有效后用splice删除对应位置的元素即可：

const targetIndex = main.items.findIndex(p => p.name === 'Shoes');
// 先判断是否找到对应元素，避免下标为-1时误删数组元素
if (targetIndex > -1) {
  // 从targetIndex位置开始，删除1个元素
  main.items.splice(targetIndex, 1);
}
console.log(main); // Shoes条目已被移除

方案2：通过filter过滤生成新数组（不修改原数组） #

如果场景要求不可变数据（比如React状态更新），或者需要保留原数组，可以直接用filter方法过滤掉目标元素，返回新数组赋值即可：

// 保留所有name不等于Shoes的元素
main.items = main.items.filter(p => p.name !== 'Shoes');
console.log(main);

两种方案的适用场景：

• 需要修改原数组、减少内存开销时选方案1
• 需要保留原数组、符合不可变数据规范时选方案2

内容的提问来源于stack exchange，提问作者Esquirish