JavaScript で配列にオブジェクトを追加する
このチュートリアルでは、JavaScript の代入演算子と push() 関数を使用して、配列にアイテムとオブジェクトを追加する方法について説明します。
JavaScript の代入演算子を使用して配列にアイテムとオブジェクトを追加する
アイテムとオブジェクトを配列に追加するには、JavaScript の代入演算子を使用できます。インデックスを使用して、アイテムまたはオブジェクトを配置する配列内の位置を定義する必要があります。既存のアイテムがすでに定義されたインデックスを占有している場合、そのアイテムは新しいアイテムまたはオブジェクトに置き換えられます。たとえば、3つの値を持つ配列を作成し、代入演算子を使用して配列の最後に項目を追加しましょう。以下のコードを参照してください。
var myArray = ['one', 'two', 'three'];
myArray[3] = 'four';
console.log(myArray)
出力：
["one", "two", "three", "four"]
上記のコードでは、myArray のインデックス 3 にアイテム four を追加しました。インデックスを使用して、配列に存在するアイテムを置き換えることもできます。次に、オブジェクトを配列に追加しましょう。以下のコードを参照してください。
var myArray = ['one', 'two', 'three'];
var myArray2 = ['four', 'five']
myArray[3] = myArray2;
console.log(myArray)
出力：
["one", "two", "three", Array(2)]
上記のコードでは、配列オブジェクト myArray2 をインデックス 3 の配列 myArray に追加しました。代入演算子を使用して、任意のデータ型のオブジェクトを配列に追加できます。
JavaScript の push() 関数を使用して、アイテムとオブジェクトを配列に追加する
アイテムとオブジェクトを配列に追加するには、JavaScript の push() 関数を使用できます。push() 関数は、配列の最後にアイテムまたはオブジェクトを追加します。たとえば、3つの値を持つ配列を作成し、push() 関数を使用して配列の最後に項目を追加しましょう。以下のコードを参照してください。
var myArray = ['one', 'two', 'three'];
myArray.push('four');
console.log(myArray)
出力：
["one", "two", "three", "four"]
上記のコードでは、myArray の最後にアイテム four を追加しました。次に、push() 関数を使用してオブジェクトを配列に追加しましょう。以下のコードを参照してください。
var myArray = ['one', 'two', 'three'];
var myArray2 = ['four', 'five']
myArray.push(myArray2);
console.log(myArray)
出力：
["one", "two", "three", Array(2)]
上記のコードでは、最後に配列オブジェクト myArray2 を配列 myArray に追加しました。push() 関数を使用して、任意のデータ型のオブジェクトを配列に追加できます。push() 関数にコンマで区切って追加することにより、配列に複数の値を追加することもできます。配列の先頭にアイテムまたはオブジェクトを追加するには、unshift() 関数を使用できます。たとえば、配列 myArray の先頭にアイテム four を追加しましょう。以下のコードを参照してください。
var myArray = ['one', 'two', 'three'];
myArray.unshift('four');
console.log(myArray)
出力：
["four", "one", "two", "three"]
出力からわかるように、項目 four が配列の先頭に追加されています。配列オブジェクトを追加する代わりに、push.apply() 関数を使用してそのすべてのアイテムを追加できます。たとえば、一方の配列に存在するアイテムをもう一方の配列に追加してみましょう。以下のコードを参照してください。
var myArray = ['one', 'two', 'three'];
var myArray2 = ['four', 'five']
myArray.push.apply(myArray, myArray2);
console.log(myArray)
出力：
["one", "two", "three", "four", "five"]
出力からわかるように、myArray2 にある 2つのアイテムが myArray に追加されています。concat() 関数を使用して、2つの配列を連結して別の配列を作成することもできます。たとえば、concat() 関数を使用して 2つの既存の配列を連結して配列を作成しましょう。以下のコードを参照してください。
var myArray = ['one', 'two', 'three'];
var myArray2 = ['four', 'five'];
var myArray3 = myArray.concat(myArray2);;
console.log(myArray3)
出力：
["four", "five", "one", "two", "three"]
連結の順序を変更することにより、myArray3 に存在するアイテムの順序を変更できます。
