JavaScript 数组删除元素

在 JavaScript 中,如果想要删除数组的某个元素,我们可以使用以下 2 种方法。

  • shift()
  • pop()

JavaScript 删除数组第一个元素

在 JavaScript 中,我们可以使用 shift() 方法来删除数组的第一个元素。

语法:

arr.shift()

说明:

shift() 方法不接收任何参数。shift() 一次性只能删除一个元素。如果想要删除多个元素,可以调用多次 shift() 方法。

注意:

  • shift() 方法会改变原数组。
  • shift() 方法会返回一个值,不过它的返回值并非删除后的数组,而是当前被删除的元素。

示例 1:shift() 删除一个元素

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
    <script>
        const arr = ["red", "green", "blue", "orange", "yellow"];
        const result = arr.shift();

        console.log(arr);
        console.log(result);
    </script>
</body>
</html>

运行结果如下。

["green", "blue", "orange", "yellow"]
red

分析:

shift() 方法会改变原数组,然后返回被删除的元素。当然了,如果你不需要用到 shift() 方法的返回值,不使用变量来接收也是可以的。比如:

const arr = ["red", "green", "blue", "orange", "yellow"];
arr.shift();
console.log(arr);

示例 2:shift() 删除多个元素

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
    <script>
        const arr = ["red", "green", "blue", "orange", "yellow"];

        arr.shift();
        arr.shift();

        console.log(arr);
    </script>
</body>
</html>

运行结果如下。

["blue", "orange", "yellow"]

分析:

想要删除多少个开头的元素,就调用多少次 shift() 方法即可。

JavaScript 删除数组最后一个元素

在 JavaScript 中,我们可以使用 pop() 方法来删除数组的最后一个元素。

语法:

arr.pop()

说明:

pop() 方法不接收任何参数。

注意:

  • pop() 方法会改变原数组。它的返回值并非删除后的数组,而是被删除的数组元素。
  • pop() 一次性只能删除一个元素。如果想要删除多个元素,可以调用多次 pop() 方法。

示例 3:pop() 删除一个元素

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
    <script>
        const arr = ["red", "green", "blue", "orange", "yellow"];
        const result = arr.pop();

        console.log(arr);
        console.log(result);
    </script>
</body>
</html>

运行结果如下。

["red", "green", "blue", "orange"]
yellow

分析:

从这个例子可以看出,pop() 方法会改变原数组,并返回被删除的元素。当然了,如果你不需要用到 pop() 方法的返回值,不使用变量来接收也是可以的。比如:

const arr = ["red", "green", "blue", "orange", "yellow"];
arr.pop();
console.log(arr);

示例 4:pop() 删除多个元素

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
    <script>
        const arr = ["red", "green", "blue", "orange", "yellow"];

        arr.pop();
        arr.pop();

        console.log(arr);
    </script>
</body>
</html>

运行结果如下。

["red", "green", "blue"]

分析:

想要删除多少个末尾的元素,就调用多少次 pop() 方法。

给站长反馈

绿叶网正在不断完善中,小伙伴们如果发现任何问题,还望多多给站长反馈,谢谢!

邮箱:lvyenet@vip.qq.com

「绿叶网」服务号
绿叶网服务号放大
关注服务号,微信也能看教程。
绿叶网服务号