概要
push,pop,unshift,shiftは Array インスタンスのメソッドで、
配列の 先頭または末尾 に要素を 追加・削除 するためのメソッド群です。
つまり、
- これらのメソッドは 配列を直接変更（破壊的操作）する
- 配列の 順序構造を操作するための基本メソッド
| 目的 | メソッド名 | 引数 | 返り値 |
|---|---|---|---|
| 要素を末尾に追加 | push() |
追加する要素（複数可） | 配列の新しい長さ |
| 要素を末尾から削除 | pop() |
なし | 削除した要素 |
| 要素を先頭に追加 | unshift() |
追加する要素（複数可） | 配列の新しい長さ |
| 要素を先頭から削除 | shift() |
なし | 削除した要素 |
目次
基本構文
JavaScript
// push: 配列の末尾に要素を追加
array.push(element1, element2, ...);
// pop: 配列の末尾から要素を削除
array.pop();
// unshift: 配列の先頭に要素を追加
array.unshift(element1, element2, ...);
// shift: 配列の先頭から要素を削除
array.shift();
活用例
push()
JavaScript
const fruits = ["apple", "banana"];
const length = fruits.push("cherry");
console.log(fruits); // ["apple", "banana", "cherry"]
console.log(length); // 3 （新しい配列の長さ）
- 対象: 配列末尾
- 返り値: 追加後の配列の長さ
- 特徴: 可変長配列を作るときに頻繁に使用
pop()
JavaScript
const fruits = ["apple", "banana", "cherry"];
const removed = fruits.pop();
console.log(fruits); // ["apple", "banana"]
console.log(removed); // "cherry"
- 対象: 配列末尾
- 返り値: 削除した要素
- 特徴: スタック（LIFO）操作に使用
unshift()
JavaScript
const fruits = ["banana", "cherry"];
const length = fruits.unshift("apple");
console.log(fruits); // ["apple", "banana", "cherry"]
console.log(length); // 3
- 対象: 配列先頭
- 返り値: 追加後の配列の長さ
- 特徴: キュー（FIFO）構造などで使用
shift()
JavaScript
const fruits = ["apple", "banana", "cherry"];
const removed = fruits.shift();
console.log(fruits); // ["banana", "cherry"]
console.log(removed); // "apple"
- 対象: 配列先頭
- 返り値: 削除した要素
- 特徴: キュー（FIFO）構造の取り出しに使用
4つのメソッドのまとめ
| メソッド名 | 操作位置 | 役割 | 返り値 | 破壊的変更 | 主な用途 |
|---|---|---|---|---|---|
push() |
末尾 | 追加 | 新しい長さ | ✅ | 配列の末尾に要素追加 |
pop() |
末尾 | 削除 | 削除した要素 | ✅ | スタックの取り出し |
unshift() |
先頭 | 追加 | 新しい長さ | ✅ | 配列の先頭に要素追加 |
shift() |
先頭 | 削除 | 削除した要素 | ✅ | キューの取り出し |