如何在JavaScript中删除数组中的特定项？

在这篇文章中，我们将总结几种常见的在JavaScript（ECMAScript 2019, ES10）中删除数组中特定元素的方法。这些方法有各自的适用场景和特点，希望通过这篇文章能帮助你选择最合适的方法来满足你的需求。

1. 一般情况

1.1 使用 `.splice()` 方法通过值删除数组元素

如果你知道要从数组中删除的值，可以使用 splice 方法。首先，你需要确定目标项的索引，然后使用该索引作为起始元素，并删除一个元素。

// 使用 'for' 循环
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0]
for (let i = 0; i < arr.length; i++) {
  if (arr[i] === 5) {
    arr.splice(i, 1)
  }
}
// 结果: [1, 2, 3, 4, 6, 7, 8, 9, 0]

// 使用 .indexOf() 方法
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0]
const i = arr.indexOf(5)
arr.splice(i, 1)
// 结果: [1, 2, 3, 4, 6, 7, 8, 9, 0]

1.2 使用 `.filter()` 方法删除数组元素

可以通过提供一个过滤函数来过滤掉特定元素。该函数会被依次应用于数组中的每个元素。

const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter((item) => item !== value)
console.log(arr)
// 结果: [1, 2, 4, 5]

1.3 通过扩展 `Array.prototype` 删除数组元素

可以通过为 Array 的原型添加额外的方法来实现。不过，扩展标准库对象（如Array）的原型被认为是一种反模式。

注意： 在标准库对象（如Array）的原型上扩展方法被某些人认为是一种反模式。

// 作用于原数组，删除所有，通过值实现
Array.prototype.remove = function (item) {
  for (let i = 0; i < this.length; i++) {
    if (this[i] === item) {
      this.splice(i, 1)
    }
  }
}
const arr1 = [1, 2, 3, 1]
arr1.remove(1) // 结果: [2, 3]

// 非作用于原数组，删除第一个，通过值实现
Array.prototype.remove = function (item) {
  const arr = this.slice()
  for (let i = 0; i < this.length; i++) {
    if (arr[i] === item) {
      arr.splice(i, 1)
      return arr
    }
  }
  return arr
}
let arr2 = [1, 2, 3, 1]
arr2 = arr2.remove(1) // 结果: [2, 3, 1]

1.4 使用 `delete` 操作符删除数组元素

使用 delete 操作符并不会影响数组的长度属性，也不会影响后续元素的索引。数组变得稀疏，也就是说被删除的项变成了 undefined。

const arr = [1, 2, 3, 4, 5, 6]
delete arr[4] // 删除索引为4的元素
console.log(arr)
// 结果: [1, 2, 3, 4, undefined, 6]

delete 操作符设计用于从JavaScript对象中删除属性，而数组也是对象的一种。

1.5 使用 `Object` 工具删除数组元素（>= ES10）

ES10 引入了 Object.fromEntries，可以用它从任意数组状对象中创建所需的数组，并在此过程中过滤掉不需要的元素。

const object = [1, 2, 3, 4]
const valueToRemove = 3
const arr = Object.values(
  Object.fromEntries(Object.entries(object).filter(([key, val]) => val !== valueToRemove))
)
console.log(arr)
// 结果: [1, 2, 4]

2. 特殊情况

2.1 如果元素在数组末尾

2.1.1 通过改变数组 `length` 属性

可以通过将数组的 length 属性设置为一个比当前值小的值来删除数组中的元素。任何索引大于等于新长度的元素将被删除。

const arr = [1, 2, 3, 4, 5, 6]
arr.length = 5 // 通过设置长度来删除元素
console.log(arr)
// 结果: [1, 2, 3, 4, 5]

2.1.2 使用 `.pop()` 方法

pop 方法删除数组的最后一个元素，返回该元素，并更新数组的长度属性。pop 方法直接修改调用它的数组，这意味着与 delete 不同，最后一个元素会被完全删除，数组长度减少。

const arr = [1, 2, 3, 4, 5, 6]
arr.pop() // 返回6
console.log(arr)
// 结果: [1, 2, 3, 4, 5]

2.2 如果元素在数组开头

shift 方法与 pop 方法类似，只不过它删除的是数组的第一个元素。当元素被删除后，其余元素会向下移动。

const arr = [1, 2, 3, 4]
arr.shift() // 返回1
console.log(arr)
// 结果: [2, 3, 4]

2.3 如果元素是数组中唯一的元素

最快速的方式是将数组变量设置为空数组。

let arr = [1]
arr = [] // 空数组

或者可以使用改变数组 length 的方法，将长度设置为0。

let arr = [1]
arr.length = 0 // 空数组

希望这篇文章能帮助你更好地理解和掌握JavaScript中删除数组元素的各种方法。根据不同的需求和场景，选择最合适的方法来操作数组将让你的代码更高效、更简洁。

1. 一般情况

1.1 使用 .splice() 方法通过值删除数组元素

1.2 使用 .filter() 方法删除数组元素

1.3 通过扩展 Array.prototype 删除数组元素

1.4 使用 delete 操作符删除数组元素

1.5 使用 Object 工具删除数组元素（>= ES10）