pop(Array、配列)
このページでは豊富な例を用いてJavaScript(js)のArrayオブジェクト(配列)のpopメソッドの使い方を学ぶことができます。
JavaScript(js)のpopメソッドはArrayオブジェクト(配列)のメソッドの1つです。
「呼び出し元の配列の末尾の要素」を削除し、削除した要素の値を返り値として返します。
TL;DR
基本
// 末尾の要素を削除し、要素の値を返り値として返す
const array1 = ['js', 'javascript', 'typescript'];
const returnValue1 = array1.pop();
console.log(array1);
==> [ 'js', 'javascript' ]
// 返り値は削除した値
console.log(returnValue1);
==> typescript
const array2 = [{ name: 'Olivia', major: 'Economics' }, { name: 'Dina', major: 'Law' }];
const returnValue2 = array2.pop();
console.log(array2);
==> [ { name: 'Olivia', major: 'Economics' } ]
console.log(returnValue2);
==> { name: 'Dina', major: 'Law' }
// 空配列の場合の返り値はundefined
const array3 = [];
const returnValue3 = array3.pop();
console.log(array3);
==> []
console.log(returnValue3);
==> undefined
配列に似たオブジェクトに対する使用
// 配列に似たオブジェクトに対する呼び出し.1
const object1 = { 0: 'A', 1: 'B', 2: 'C', length: 3 };
const returnValue1 = Array.prototype.pop.call(object1);
console.log(object1);
==> { '0': 'A', '1': 'B', length: 2 }
console.log(returnValue1);
==> C
// 配列に似たオブジェクトに対する呼び出し.2
const object2 = { 0: 'A', 1: 'B', 2: 'C', length: 3 };
const returnValue2 = Array.prototype.pop.apply(object2);
console.log(object2);
==> { '0': 'A', '1': 'B', length: 2 }
console.log(returnValue2);
==> C
解説
基本
popメソッドは「呼び出し元の配列の末尾の要素」を削除し、削除された値を返り値として返します。
空配列に対して使用すると返り値はundefined
となり、呼び出し元の配列にも変化はありません。
const array1 = [true, true, true, false];
const returnValue1 = array1.pop();
console.log(array1);
==> [ true, true, true ]
// 返り値は削除された要素の値
console.log(returnValue1);
==> false
// 空配列
const array2 = [];
const returnValue2 = array2.pop();
console.log(array2);
==> []
console.log(returnValue2);
==> undefined
配列に似たオブジェクトに対する使用
call
メソッドやapply
メソッドを使用することで「配列に似たオブジェクト」に対してpopメソッドを使用することもできます。
対象のオブジェクトは数値のプロパティとlength
プロパティなどを持っていることが必要であり、
条件を満たさないオブジェクトに対してpopメソッドを呼び出しても期待通りの挙動にはなりません。
// 配列に似たオブジェクトに対する呼び出し.1
const object1 = { 0: 'Foo', 1: 'Bar', 2: 'Ninja', length: 3 };
const returnValue1 = Array.prototype.pop.call(object1);
console.log(object1);
==> { '0': 'Foo', '1': 'Bar', length: 2 }
console.log(returnValue1);
==> Ninja
// 配列に似たオブジェクトに対する呼び出し.2
const object2 = { 0: 'Foo', 1: 'Bar', 2: 'Ninja', length: 3 };
const returnValue2 = Array.prototype.pop.apply(object2);
console.log(object2);
==> { '0': 'Foo', '1': 'Bar', length: 2 }
console.log(returnValue2);
==> Ninja
1次情報
Array.prototype.pop() - MDN web docs