JS删除数组的几种方式

在JavaScript中数组元素删除的八种方法汇总这篇文章中，我们总结了八种数组删除的JS方法，下面我们将他们应用于具体场景中，更好的说明JS中如何删除数组元素。

一、删除第一个元素

1、shift() 方法

调用shift()方法可以把数组的第一个元素删除，并返回第一个元素的值。

注意： 此方法改变数组的长度！

提示: 移除数组末尾的元素可以使用 pop() 方法。

var arr = [1, 2, 3, 4]
arr.shift()  // 1
// arr => [2, 3, 4]

2、slice() 方法

slice() 方法可从已有的数组中返回选定的元素。

slice() 方法不仅可以用于数组，还能用于字符串。slice() 方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。

注意： slice() 方法不会改变原始数组。

var arr = [1,2,3,4]
var newArr = arr.slice(1)
// arr => [1,2,3,4]
// newArr => [2,3,4]

3、splice() 方法

splice() 方法用于添加或删除数组中的元素。

注意：这种方法会改变原始数组。

如果删除一个元素，则返回一个元素的数组。 如果未删除任何元素，则返回空数组

var arr = [1, 2, 3, 4];
arr.splice(0,1);      //[1]
console.log(arr);    //[2, 3, 4]

二、删除最后一个元素

1、pop() 方法

调用pop()方法会删除数组最后一个元素，并返回删除的元素。

注意：此方法改变原数组！

提示： 移除数组第一个元素，请使用 shift() 方法。

var arr = [1, 2, 3, 4];
arr.pop()    //4
console.log(arr)    //[1, 2, 3]

2、slice() 方法

var arr = [1,2,3,4]
var newArr = arr.slice(0, arr.length - 1)
// arr => [1,2,3,4]
// newArr => [1,2,3]

3、 splice() 方法

var arr = [1,2,3,4]
var newArr = arr.splice(arr.length - 1, 1)
// arr => [1, 2, 3]
// newArr => [4]

三、删除数组中某个指定下标的元素

1、splice 删除

let index = 3

let arr = [1,2,3,4,5]

 arr.splice(index, 1) // [4]

// arr => [1,2,3,5]

2、for循环push删除

通过循环遍历数组，将符合条件的元素push到新的数组中

let index = 3, // 删除的id

let arr = [1,2,3,4,5],

let arrLen = arr.length,

let newArr = [];

for (let i = 0; i < arrLen; i++) {

    if (i !== index) {

        newArr.push(arr[i])

    }

}  

// arr => [1,2,3,4,5]

// newArr => [1,2,3,5]

3、for循环splice删除

通过循环遍历数组，使用splice()方法将符合条件的元素删除

let index = 3 // 删除的id

var arr = [1,2,3,4,5]

arr.forEach(function(item, i) {
    if(i == index) {
        arr.splice(i, 1);
    }
});

// arr => [1, 2, 3, 5]

4、delete删除

JavaScript提供了一个delete关键字用来删除（清除）数组元素。

要注意的是，使用delete删除元素之后数组长度不变，只是被删除元素被置为undefined了。遍历直接跳过undefined

let index = 3

let arr = [1,2,3,4,5]

delete arr[index]

// arr  = > [1, 2, 3, undefined, 5]

四、删除数组中某个指定元素

1、splice 删除

let value = 'b',

let arr = ['a','b','c','d']



arr.splice(arr.indexOf(value), 1) // ['b']

// arr => ['a','c','d']

2、filter 删除

let arr = ['a','b','c','d'],
let value = 'b'
arr = arr.filter(item => item != value)
// arr => ['a','c','d']

3、for 删除

let value = 'b',

let arr = ['a','b','c','d'],

let arrLen = arr.length,

let newArr = []

for (let i = 0; i < arrLen; i++) {

    if (arr[i] !== value) {

        newArr.push(arr[i])

    }

}  

// 其他forEach、map、for of循环同理

4、Set 删除

let arr = ['a','b','c','d'],

let  value = 'b'

let newSet = new Set(arr)

newSet.delete(value)

let newArr = [...newSet]

// newArr => ['a','c','d']