Jak dołączyć element do tablicy w JavaScript?
Dołączanie elementu do tablicy w JavaScript oznacza dodanie nowego elementu na końcu tablicy. , proces ten zwiększa długość tablicy, dostosowując się do nowych danych. JavaScript oferuje kilka metod dołączania elementów, które przyjmują jeden lub więcej elementów jako argumenty i dodają je na końcu tablicy.
Oto następujące sposoby rozwiązania problemu:
Spis treści
- Korzystanie z metody push() JavaScript
- Korzystanie z metody unshift() JavaScript
- Korzystanie z metody splice() JavaScript
- Korzystanie z metody concat() JavaScript
- Operator rozprzestrzeniania JavaScript
- Korzystanie z funkcji Lodash _.concat().
- Korzystanie z właściwości długości tablicy
1. Korzystanie z metody push() JavaScript
Metoda push() JavaScript doda element na końcu tablicy, podczas gdy jego bliźniacza funkcja, the metoda pop(). , usunie element z końca tablicy. Jeśli chcesz dodać element lub wiele elementów na końcu tablicy, metoda metoda push(). będzie prawie zawsze najprostszą i najszybszą opcją.
Składnia:
array.push(item1, item2, ..., itemX)
Przykład: W tym przykładzie dodamy nowe elementy na końcu tablicy za pomocą metody 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); Wyjście
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5,Geeks6
2. Korzystanie z metody unshift() JavaScript
Metoda unshift() JavaScript doda element na początek tablicy, podczas gdy jej bliźniacza funkcja, shift(), usunie jeden element z początku tablicy.
Składnia:
array.unshift(item1, item2, ..., itemX)
Przykład: W tym przykładzie dodamy nowe elementy na początek tablicy za pomocą metody 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); Wyjście
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks5,Geeks6,Geeks1,Geeks2,Geeks3,Geeks4
3. Korzystanie z metody JavaScript splice().
Metoda JavaScript splice(). modyfikuje zawartość tablicy poprzez usunięcie istniejących elementów i/lub dodanie nowych elementów.
Składnia:
array.splice(index, amount, item1, ....., itemX)
Przykład: W tym przykładzie będziemy dodawać nowe elementy pod trzecim indeksem tablicy za pomocą metody splice().
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); Wyjście
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks5,Geeks6,Geeks4
4. Korzystanie z metody concat() JavaScript
Metoda concat() JavaScript zwraca nową połączoną tablicę składającą się z tablicy, na której jest wywoływana, połączonej z tablicą (lub tablicami) z jej argumentu. Ta metoda służy do łączenia dwóch lub więcej tablic i ta metoda nie zmienia istniejących tablic, ale zwraca nową tablicę zawierającą wartości połączonych tablic.
Składnia:
array1.concat(array2, array3, ..., arrayX)
Przykład: W tym przykładzie połączymy trzy tablice za pomocą metody metoda concat(). JavaScriptu.
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);
Wyjście
[ 'Geeks1', 'Geeks2', 'Geeks3', 'Geeks4', 'GeeksForGeeks' ]
5. Operator rozprzestrzeniania JavaScript
Operator rozprzestrzeniania JavaScript umożliwia iterowalne rozwinięcie w miejscach, gdzie oczekuje się 0+ argumentów. Jest najczęściej używany w tablicy zmiennych, gdzie oczekiwana jest więcej niż 1 wartość. Daje nam to przywilej uzyskania listy parametrów z tablicy.
Składnia:
let variablename1 = [...value];
Przykład: Ten przykład pokazuje implementację wyżej wyjaśnionego podejścia.
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);
Wyjście
[ 2, 4, 6, 8, 3, 5, 7 ]
6. Korzystanie z funkcji Lodash _.concat().
Oczekiwano więcej niż 1 wartości. Pozwala nam łączyć wartości w tablicę.
Składnia:
_.concat(array, [values]);
Przykład: Ten przykład pokazuje wdrożenie wyżej wyjaśnionego podejścia.
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); Wyjście:
Before concat: 1,2,3 After concat: 1,2,3,0,5,a,b
7. Korzystanie z właściwości długości tablicy
Tablice JavaScript mają właściwość długości, której można używać do dynamicznego dołączania elementów na końcu tablicy. Przypisując do indeksu wartość równą bieżącej długości tablicy, można dodać nowy element.
Przykład:
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); Wyjście
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5