JavaScript で要素を配列に追加する 配列の末尾に新しい項目を追加することを意味します。 、このプロセスは配列の長さを拡張し、新しいデータに対応します。 JavaScript には、1 つ以上の要素を引数として受け取り、それらを配列の末尾に追加する要素を追加するためのメソッドがいくつか用意されています。
問題を解決するには次の方法があります。
目次
- JavaScriptのpush()メソッドの使用
- JavaScript unshift() メソッドの使用
- JavaScript splice() メソッドの使用
- JavaScript concat() メソッドの使用
- JavaScript スプレッド演算子
- Lodash _.concat() 関数の使用
- 配列の長さプロパティの使用
1. JavaScriptのpush()メソッドの使用
JavaScriptのpush()メソッド は配列の末尾に要素を追加しますが、その双子の関数である Pop() メソッド 、配列の末尾から要素を削除します。 1 つまたは複数の要素を配列の末尾に追加する必要がある場合、 Push()メソッド ほとんどの場合、これが最も簡単で迅速なオプションになります。
構文：
array.push(item1, item2, ..., itemX)>
例： この例では、push() メソッドを使用して配列の末尾に新しい要素を追加します。
JavaScript // Input array let Geeks = ['Geeks1', 'Geeks2', 'Geeks3', 'Geeks4']; // Display input array console.log('Original Array: ' + Geeks); // Pushing arrays Geeks.push('Geeks5', 'Geeks6'); // Display updated array console.log('Updated Array: ' + Geeks);> 出力
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5,Geeks6>
2. JavaScript unshift() メソッドの使用
JavaScript unshift() メソッド は配列の先頭に要素を追加し、その双子の関数であるshift() は配列の先頭から 1 つの要素を削除します。
構文：
array.unshift(item1, item2, ..., itemX)>
例： この例では、unshift() メソッドを使用して、配列の先頭に新しい要素を追加します。
JavaScript // Input array let Geeks = ['Geeks1', 'Geeks2', 'Geeks3', 'Geeks4']; // Display input array console.log('Original Array: ' + Geeks); // Adding element in begining Geeks.unshift('Geeks5', 'Geeks6'); // Display updated array console.log('Updated Array: ' + Geeks);> 出力
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks5,Geeks6,Geeks1,Geeks2,Geeks3,Geeks4>
3. JavaScript splice() メソッドの使用
JavaScript splice() メソッド 既存の要素を削除したり、新しい要素を追加したりして、配列の内容を変更します。
構文：
array.splice(index, amount, item1, ....., itemX)>
例： この例では、splice() メソッドを使用して、配列の 3 番目のインデックスに新しい要素を追加します。
JavaScript // Input array let Geeks = ['Geeks1', 'Geeks2', 'Geeks3', 'Geeks4']; // Display input array console.log('Original Array: ' + Geeks); // Update array using slice Geeks.splice(2, 1, 'Geeks5', 'Geeks6'); // Display updated array console.log('Updated Array: ' + Geeks);> 出力
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks5,Geeks6,Geeks4>
4. JavaScript concat() メソッドの使用
JavaScript concat() メソッド は、呼び出された配列とその引数の配列 (または複数の配列) で構成される新しい結合配列を返します。このメソッドは 2 つ以上の配列を結合するために使用されます。このメソッドは既存の配列を変更しませんが、結合された配列の値を含む新しい配列を返します。
構文：
array1.concat(array2, array3, ..., arrayX)>
例： この例では、次のコマンドを使用して 3 つの配列をマージします。 concat() メソッド JavaScriptの。
JavaScript // Input arrays let g1 = ['Geeks1', 'Geeks2']; let g2 = ['Geeks3', 'Geeks4']; let g3 = ['GeeksForGeeks']; // Concate g1, g2 and g3 into g4 let g4 = g1.concat(g2, g3); //Display output console.log(g4);>
出力
[ 'Geeks1', 'Geeks2', 'Geeks3', 'Geeks4', 'GeeksForGeeks' ]>
5.JavaScript スプレッド演算子
JavaScript スプレッド演算子 0 個以上の引数が予期される場所で反復可能を展開できるようにします。これは主に、複数の値が期待される変数配列で使用されます。これにより、配列からパラメータのリストを取得する権限が与えられます。
構文：
let variablename1 = [...value];>
例： この例は、上記で説明したアプローチの実装を示しています。
JavaScript // Input arrays let Array1 = [2, 4, 6, 8]; let Array2 = [3, 5, 7] // Combine and create new array // using spread operator newArray = [ ...Array1, ...Array2] // Display output console.log(newArray);>
出力
[ 2, 4, 6, 8, 3, 5, 7 ]>
6. Lodash _.concat() 関数の使用
1 つ以上の値が必要です。これにより、値を配列にマージできるようになります。
構文：
_.concat(array, [values]);>
例： この例は、上記で説明したアプローチの実装を示しています。
JavaScript // Requiring the lodash library let lodash = require('lodash'); // Original array to be concatenated let array = [1, 2, 3]; // Values to be added to original array let values = [0, 5, 'a', 'b'] let newArray = lodash.concat(array, values); console.log('Before concat: ' + array); // Printing newArray console.log('After concat: ' + newArray);> 出力：
Before concat: 1,2,3 After concat: 1,2,3,0,5,a,b>
7. 配列の長さプロパティの使用
JavaScript 配列には、要素を配列の末尾に動的に追加するために使用できる length プロパティがあります。配列の現在の長さに等しいインデックスに値を割り当てることにより、新しい要素を追加できます。
例：
JavaScript // Input array let Geeks = ['Geeks1', 'Geeks2', 'Geeks3', 'Geeks4']; // Display input array console.log('Original Array: ' + Geeks); // Append element using the length property Geeks[Geeks.length] = 'Geeks5'; // Display updated array console.log('Updated Array: ' + Geeks);> 出力
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5>