このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docsコミュニティーについてもっと知り、仲間になるにはこちらから。
Array.prototype.push()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
push() はArray インスタンスのメソッドで、配列の末尾に指定された要素を追加します。また返値として配列の新しい長さを返します。
試してみましょう
const animals = ["pigs", "goats", "sheep"];const count = animals.push("cows");console.log(count);// 予想される結果: 4console.log(animals);// 予想される結果: Array ["pigs", "goats", "sheep", "cows"]animals.push("chickens", "cats", "dogs");console.log(animals);// 予想される結果: Array ["pigs", "goats", "sheep", "cows", "chickens", "cats", "dogs"]構文
push()push(element1)push(element1, element2)push(element1, element2, /* …, */ elementN)引数
element1, …,elementN配列の末尾に追加する要素。
返値
メソッドが呼び出されたオブジェクトの新しいlength プロパティ。
解説
push() メソッドは配列の末尾に要素を追加します。
Array.prototype.unshift() はpush() と同様の動作ですが、配列の先頭に適用されます。
push() メソッドは変更メソッドです。これは、this の長さとコンテンツを変更します。this の値はそのままで、最後に要素を追加した新しい配列を返したい場合は、代わりにarr.concat([element0, element1, /* ... ,*/ elementN]) を使用することができます。要素が余分な配列に包まれていることに注意してください。そうでなければ、要素が配列そのものである場合、concat() の動作により、単一の要素として挿入されるのではなく、分散されてしまうでしょう。
pop() メソッドは汎用的です。これはthis 値にlength プロパティと整数キーのプロパティがあることだけを期待します。文字列も配列風ですが、文字列は不変であるため、このメソッドを適用するのは適切ではありません。
例
配列に要素を追加する
以下のコードは 2 つの要素を持つ配列sports を生成し、それに 2 つの要素を追加します。コードの実行後、変数total には 4 が入ります。
const sports = ["soccer", "baseball"];const total = sports.push("football", "swimming");console.log(sports); // ['soccer', 'baseball', 'football', 'swimming']console.log(total); // 4２つの配列をマージする
この例ではスプレッド構文を使用して、二番目の配列から最初の配列へすべての要素を挿入します。
const vegetables = ["parsnip", "potato"];const moreVegs = ["celery", "beetroot"];// 1 つ目の配列に 2 つ目の配列をマージさせますvegetables.push(...moreVegs);console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']2 つの配列の結合は、concat() メソッドでも行うことができます。
配列以外のオブジェクトに対する push() の呼び出し
push() メソッドはthis のlength プロパティを読み込みます。そして、length から始まるthis の各インデックスをpush() に渡された引数で設定します。最後に、length に直前の長さにプッシュされた要素数を加えた値を設定します。
const arrayLike = { length: 3, unrelated: "foo", 2: 4,};Array.prototype.push.call(arrayLike, 1, 2);console.log(arrayLike);// { '2': 4, '3': 1, '4': 2, length: 5, unrelated: 'foo' }const plainObj = {};// length プロパティがないので、長さは 0Array.prototype.push.call(plainObj, 1, 2);console.log(plainObj);// { '0': 1, '1': 2, length: 2 }オブジェクトを配列のように使用する
前述したように、push は内部的には汎用的なので、その利点を活かすことができます。この例が示しているように、オブジェクト上でArray.prototype.push は正しく動作します。
オブジェクトの集合を保存するために、配列を生成していないことに注意してください。代わりに、集合をオブジェクト自体に保存して、配列を扱っているかのように見せかけるためにArray.prototype.push 上でcall を使用しています。そして、JavaScript は実行コンテキストの確立を許可しているおかげで、これは動作します。
const obj = { length: 0, addElem(elem) { // obj.length は、要素が追加されるたびに // 自動的に増加する。 [].push.call(this, elem); },};// 例示のために空のオブジェクトを追加する。obj.addElem({});obj.addElem({});console.log(obj.length); // 2obj は配列ではありませんが、本当の配列を扱っているかのようにpush メソッドはobj のlength プロパティを増加させできていることに注意してください。
仕様書
| Specification |
|---|
| ECMAScript® 2026 Language Specification # sec-array.prototype.push |