配列に何かを追加するには？

JavaScriptで配列にオブジェクト（文字列や数値など）を追加するには？

whackamadoodle3000
編集された質問 10日 9月 2017 в 7:21
プログラミング
append arrays javascript
9日 12月 2008 в 12:20
13 ビュー
ソリューション

配列に値を追加するには、Array.prototype.pushメソッドを使用します。

// initialize array
var arr = [
  "Hi",
  "Hello",
  "Bonjour"
];

// append new value to the array
arr.push("Hola");

console.log(arr);

一度の呼び出しで複数の値を配列に追加するには、push()関数を使用します。

// initialize array
var arr = ["Hi", "Hello", "Bonjour", "Hola"];

// append multiple values to the array
arr.push("Salut", "Hey");

// display all values
for (var i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

**アップデート

ある配列の項目を別の配列に追加したい場合は、firstArray.concat(secondArray)を使います。

var arr = [
  "apple",
  "banana",
  "cherry"
];

arr = arr.concat([
  "dragonfruit",
  "elderberry",
  "fig"
]);

console.log(arr);

**アップデート

配列の先頭に値を追加したい場合、つまり最初のインデックスに値を追加したい場合は、Array.prototype.unshiftを使用することができます。

var arr = [1, 2, 3];
arr.unshift(0);
console.log(arr);

また、pushのように複数の値を一度に追加することもできます。

Jack Bashford
編集した答え 23日 6月 2019 в 1:22
解説 (12)

単一の変数を追加するだけであれば、push()で十分です。別の配列を追加する必要がある場合は、concat()を使用してください。

var ar1 = [1, 2, 3];
var ar2 = [4, 5, 6];

var ar3 = ar1.concat(ar2);

alert(ar1);
alert(ar2);
alert(ar3);

concatは、例えば再割り当てされない限り、ar1とar2には影響しません。

var ar1 = [1, 2, 3];
var ar2 = [4, 5, 6];

ar1 = ar1.concat(ar2);
alert(ar1);

たくさんの素晴らしい情報がここに掲載されています。

Jack Bashford
編集した答え 23日 6月 2019 в 1:24
解説 (6)

簡単なベンチマーク（各テスト＝500kの要素を付加し、結果は複数回の実行の平均値）を行ったところ、次のような結果が得られました。

Firefox 3.6 (Mac):

  • 小さな配列。小さな配列： arr[arr.length] = b の方が速い (300ms vs 800ms)
  • 大規模な配列の場合arr.push(b)` の方が速い (500ms vs. 900ms)

Safari 5.0 (Mac):

  • 小さな配列の場合arr[arr.length] = b` の方が高速です (90ms vs. 115ms)
  • 大規模な配列の場合大規模な配列： arr[arr.length] = b の方が速い （160ms vs. 185ms

Google Chrome 6.0 (Mac):

  • 小規模な配列。大きな違いはありません (しかも、Chromeは速い! たったの~38ms !!)
  • 大規模な配列の場合大きな違いはありません (160ms)

私は arr.push() 構文の方が好きですが、少なくとも素の速度では arr[arr.length] バージョンの方が良いと思います。でも、IEでの実行結果を見てみたいですね。

私のベンチマーク用ループ。

function arrpush_small() {
    var arr1 = [];
    for (a = 0; a < 100; a++)
    {
        arr1 = [];
        for (i = 0; i < 5000; i++)
        {
            arr1.push('elem' + i);
        }
    }
}

function arrlen_small() {
    var arr2 = [];
    for (b = 0; b < 100; b++)
    {
        arr2 = [];
        for (j = 0; j < 5000; j++)
        {
            arr2[arr2.length] = 'elem' + j;
        }
    }
}

function arrpush_large() {
    var arr1 = [];
    for (i = 0; i < 500000; i++)
    {
        arr1.push('elem' + i);
    }
}

function arrlen_large() {
    var arr2 = [];
    for (j = 0; j < 500000; j++)
    {
        arr2[arr2.length] = 'elem' + j;
    }
}
whackamadoodle3000
編集した答え 10日 9月 2017 в 7:27
解説 (9)