JavaScript 数组 Pop

摘要: 在本教程中,您将学习如何使用 JavaScript 数组 pop() 方法从数组中删除最后一个元素。

JavaScript 数组 pop() 方法简介

Array.prototype.pop() 方法从一个数组中删除最后一个元素,并返回被删除的元素。以下是 pop() 方法的语法

array.pop()Code language: CSS (css)

pop() 方法会改变数组的 length 属性。如果数组为空,pop() 会返回 undefined

JavaScript pop() 方法示例

让我们来看一些使用 pop() 方法的示例。

1) 使用 JavaScript 数组 pop() 方法删除数组的最后一个元素

以下示例使用 pop() 方法删除 numbers 数组的最后一个元素

const numbers = [10, 20, 30];
const last = numbers.pop();

console.log(last); // 30
console.log(numbers.length); // 2Code language: JavaScript (javascript)

输出

30
2

在这个例子中,pop() 方法从 numbers 数组中删除了数字 30。同时,它将 numbers 数组的 length 属性值减至 2

下图说明了 pop() 方法的工作原理

JavaScript Array Pop

2) 使用 JavaScript 数组 pop() 方法处理空数组

以下示例在空数组上调用 pop() 方法。在这种情况下,pop() 方法返回 undefined,数组的 length 为零

const numbers = [];
const last = numbers.pop();

console.log(last);
console.log(numbers.length);Code language: JavaScript (javascript)

输出

undefined
0Code language: JavaScript (javascript)

使用 JavaScript pop() 方法处理类数组对象

pop() 方法是通用的。因此,您可以使用 call()apply() 在类数组对象上调用 pop() 方法。在内部,pop() 使用类数组对象的 length 属性来确定要删除的最后一个元素。

请看以下示例

let greetings = {
  0: 'Hi',
  1: 'Hello',
  2: 'Howdy',
  length: 2,
  removeLast() {
    return [].pop.call(this);
  },
};

let greting = greetings.removeLast();

console.log(greting);
console.log(greetings);
Code language: JavaScript (javascript)

输出

'Howdy'

{
  '0': 'Hi',
  '1': 'Hello',
  length: 2,
  removeLast: [Function: removeLast]
}Code language: JavaScript (javascript)

工作原理。

首先,定义一个 greetings 对象,它具有

  • 四个属性 0、1、2 和 length。
  • 一个名为 removeLast() 的方法,它使用数组的 call() 方法来调用 pop() 方法。

其次,调用 greetings 对象的 removeLast() 方法

let greting = greetings.removeLast();Code language: JavaScript (javascript)

第三,将删除的元素(greeting)和 greetings 对象输出到控制台

console.log(greting);
console.log(greetings);Code language: JavaScript (javascript)

总结

  • 使用 pop() 方法删除数组的最后一个元素。
  • 使用 call()apply() 在类数组对象上调用 pop() 方法。
本教程是否有用?