配列.push() / pop() / shift() / unshift()

// 末尾に要素を追加します。
配列.push(要素1, 要素2, ...);

// 末尾の要素を削除して返します。
var removed = 配列.pop();

// 先頭に要素を追加します。
配列.unshift(要素1, 要素2, ...);

// 先頭の要素を削除して返します。
var removed = 配列.shift();

sample_push.js

// パターン1: 基本操作（push / pop / unshift / shift）
var members = ["桐生一馬", "真島吾朗"];

// 末尾に要素を追加します。
members.push("秋山駿");
console.log(members); // 『桐生一馬,真島吾朗,秋山駿』と出力されます。

// 末尾の要素を削除します。
var last = members.pop();
console.log(last); // 『秋山駿』と出力されます。
console.log(members); // 『桐生一馬,真島吾朗』と出力されます。

// 先頭に要素を追加します。
members.unshift("錦山彰");
console.log(members); // 『錦山彰,桐生一馬,真島吾朗』と出力されます。

// 先頭の要素を削除します。
var first = members.shift();
console.log(first); // 『錦山彰』と出力されます。
console.log(members); // 『桐生一馬,真島吾朗』と出力されます。

// パターン2: pushの戻り値（追加後の配列の長さ）
var party = ["冴島大河"];
var newLength = party.push("秋山駿", "品田辰雄");
console.log(newLength); // 『3』と出力されます。追加後の長さです。
console.log(party); // 『冴島大河,秋山駿,品田辰雄』と出力されます。

// パターン3: スタック（後入れ先出し）の実装
var stack = [];
stack.push("桐生一馬");
stack.push("真島吾朗");
stack.push("錦山彰");
console.log(stack.pop()); // 『錦山彰』と出力されます。最後に追加したものが出ます。
console.log(stack.pop()); // 『真島吾朗』と出力されます。
console.log(stack.length); // 『1』と出力されます。

// パターン4: キュー（先入れ先出し）の実装
var queue = [];
queue.push("桐生一馬");
queue.push("真島吾朗");
queue.push("秋山駿");
console.log(queue.shift()); // 『桐生一馬』と出力されます。最初に追加したものが出ます。
console.log(queue.shift()); // 『真島吾朗』と出力されます。
console.log(queue.length); // 『1』と出力されます。

[ '桐生一馬', '真島吾朗', '秋山駿' ]
秋山駿
[ '桐生一馬', '真島吾朗' ]
[ '錦山彰', '桐生一馬', '真島吾朗' ]
錦山彰
[ '桐生一馬', '真島吾朗' ]
3
[ '冴島大河', '秋山駿', '品田辰雄' ]
錦山彰
真島吾朗
1
桐生一馬
真島吾朗
1

これら4つのメソッドは配列の末尾と先頭の要素を操作する最も基本的なメソッドです。『配列.push()』と『配列.pop()』は末尾を、『配列.unshift()』と『配列.shift()』は先頭を操作します。いずれも元の配列を直接変更する破壊的メソッドです。

『配列.push()』は複数の要素をカンマ区切りで一度に追加でき、戻り値は追加後の配列の長さです。一方『配列.pop()』は引数を取らず、削除した要素そのものを返します。スタック（後入れ先出し）のデータ構造を実現する際に、この2つのメソッドの組み合わせが活用されます。

配列の途中にある要素を追加・削除したい場合は『配列.splice()』を使用してください。