JavaScript配列のポップ

概要: このチュートリアルでは、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オブジェクトを定義します。

  • 4つのプロパティ0, 1, 2、およびlength。
  • pop()メソッドを呼び出すために配列のcall()メソッドを使用する1つのメソッドremoveLast()

次に、greetingsオブジェクトのremoveLast()メソッドを呼び出します。

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

3番目に、削除された要素(greeting)とgreetingsオブジェクトをコンソールに出力します。

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

要約

  • 配列の最後の要素を削除するには、pop()メソッドを使用します。
  • 配列のようなオブジェクトでpop()メソッドを呼び出すには、call()またはapply()を使用します。
このチュートリアルは参考になりましたか?