配列の要素を取り出す

配列から要素を取り出す

配列にある要素を取り出す方法は3種類あります。

• popメソッドを使う
• shiftメソッドを使う
• spliceメソッドを使う

いずれのメソッドを使った方法も、要素を取り出すと元の配列からは削除されます。

配列の末尾から要素を取り出す

popメソッドを使うと、配列の末尾にある要素を1つ取り出すことができます。
配列の末尾に要素を追加するpushメソッドの対になるメソッドです。

コード例

var animals = [ 'cat', 'dog', 'mouse'];

var item = animals.pop();
console.log(item); // mouse

item = animals.pop();
console.log(item); // dog

配列の添字（キー）を指定せず、機械的に末尾から要素を取り出したいときに便利なメソッドです。
要素の取り出しは1つずつしか行えないため、複数取り出したいときは取り出す数だけメソッドを呼び出します。

配列の先頭から要素を取り出す

shiftメソッドを使うと、配列の先頭から要素を1つ取り出すことができます。
配列の先頭に要素を追加するunshiftメソッドの対になるメソッドです。

コード例

var animals = [ 'cat', 'dog', 'mouse'];

var item = animals.shift();
console.log(item); // cat

item = animals.shift();
console.log(item); // dog

popメソッドとは取り出す位置が正反対になりますが、取り出す要素の添字（キー）を指定する必要がなく機械的に取り出すことができる機能は共通です。
shiftメソッドも要素の取り出しは1つずつしか行えないため、複数取り出したいときは取り出す数だけメソッドを呼び出す必要があります。

配列の指定した位置から要素を取り出す

spliceメソッドは配列の指定した位置から、任意の数だけ要素を取得することができます。
以下の例では配列の2つ目以降の要素を全て取り出します。

コード例

var animals = [ 'cat', 'dog', 'mouse', 'penguin', 'fox'];

var item = animals.splice(1);
console.log(item); // (4) ["dog", "mouse", "penguin", "fox"]

console.log(animals); // ["cat"]

取り出した値はArrayオブジェクトになります。

配列の2つ目の要素を1つだけ取り出すときは、第2パラメータに取得する要素の数を指定します。

コード例

var animals = [ 'cat', 'dog', 'mouse', 'penguin', 'fox'];

var item = animals.splice( 1, 1);
console.log(item); // ["dog"]

console.log(animals); // (4) ["cat", "mouse", "penguin", "fox"]

配列の要素を2つ目〜末尾の1つ前の要素を取得するときは、パラメータを次のように指定しています。

コード例

var animals = [ 'cat', 'dog', 'mouse', 'penguin', 'fox'];

var item = animals.splice(1, (animals.length-2));
console.log(item); // (3) ["dog", "mouse", "penguin"]

console.log(animals); // (2) ["cat", "fox"]

popメソッドと同じように末尾から要素を取り出したいときは、開始位置に-1を指定します。

コード例

var animals = [ 'cat', 'dog', 'mouse', 'penguin', 'fox'];

var item = animals.splice(-1);
console.log(item); // ["fox"]

item = animals.splice(-1);
console.log(item); // ["penguin"]

console.log(animals); // (3) ["cat", "dog", "mouse"]

配列の末尾から2つ要素を取得することもできます。

コード例

var animals = [ 'cat', 'dog', 'mouse', 'penguin', 'fox'];

var item = animals.splice( -2, 2);
console.log(item); // (2) ["penguin", "fox"]

console.log(animals); // (3) ["cat", "dog", "mouse"]

配列に要素を追加する方法については、「配列に要素を追加する」を参照してください。

こちらの記事は役に立ちましたか？

コメントありがとうございます！
運営の参考にさせていただきます。