Ajout d'un élément à un tableau en JavaScript signifie ajouter un nouvel élément à la fin du tableau. , ce processus étend la longueur du tableau, acceptant de nouvelles données. JavaScript propose plusieurs méthodes pour ajouter des éléments qui acceptent un ou plusieurs éléments comme arguments et les ajoutent à la fin du tableau.
Voici les manières suivantes pour résoudre le problème :
Table des matières
- Utilisation de la méthode JavaScript push()
- Utilisation de la méthode JavaScript unshift()
- Utilisation de la méthode JavaScript splice()
- Utilisation de la méthode JavaScript concat()
- Opérateur de diffusion Javascript
- Utilisation de la fonction Lodash _.concat()
- Utilisation de la propriété de longueur de tableau
1. Utilisation de la méthode JavaScript push()
Méthode JavaScript push() ajoutera un élément à la fin d'un tableau, tandis que sa fonction jumelle, la Méthode pop() , supprimera un élément de la fin du tableau. Si vous devez ajouter un ou plusieurs éléments à la fin d'un tableau, le méthode push() sera presque toujours votre option la plus simple et la plus rapide.
Syntaxe:
array.push(item1, item2, ..., itemX)>
Exemple: Dans cet exemple, nous ajouterons de nouveaux éléments à la fin du tableau en utilisant la méthode 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);> Sortir
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5,Geeks6>
2. Utilisation de la méthode JavaScript unshift()
Méthode JavaScript unshift() ajoutera un élément au début d'un tableau, tandis que sa fonction jumelle, shift(), supprimera un élément du début du tableau.
Syntaxe:
array.unshift(item1, item2, ..., itemX)>
Exemple: Dans cet exemple, nous ajouterons de nouveaux éléments au début du tableau en utilisant la méthode 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);> Sortir
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks5,Geeks6,Geeks1,Geeks2,Geeks3,Geeks4>
3. Utilisation de la méthode JavaScript splice()
Méthode JavaScript splice() modifie le contenu d'un tableau en supprimant des éléments existants et/ou en ajoutant de nouveaux éléments.
Syntaxe:
array.splice(index, amount, item1, ....., itemX)>
Exemple: Dans cet exemple, nous ajouterons de nouveaux éléments au 3ème index du tableau en utilisant la méthode 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);> Sortir
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks5,Geeks6,Geeks4>
4. Utilisation de la méthode JavaScript concat()
Méthode JavaScript concat() renvoie un nouveau tableau combiné composé du tableau sur lequel il est appelé, joint au tableau (ou aux tableaux) de son argument. Cette méthode est utilisée pour joindre deux ou plusieurs tableaux et cette méthode ne modifie pas les tableaux existants, mais renvoie un nouveau tableau contenant les valeurs des tableaux joints.
Syntaxe:
array1.concat(array2, array3, ..., arrayX)>
Exemple: Dans cet exemple, nous fusionnerons trois tableaux en utilisant le méthode concat() de 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);>
Sortir
[ 'Geeks1', 'Geeks2', 'Geeks3', 'Geeks4', 'GeeksForGeeks' ]>
5. Opérateur de diffusion Javascript
Opérateur de diffusion Javascript permet à un itérable de se développer aux endroits où plus de 0 arguments sont attendus. Il est principalement utilisé dans le tableau de variables où plus d’une valeur est attendue. Cela nous donne le privilège d'obtenir une liste de paramètres à partir d'un tableau.
Syntaxe:
let variablename1 = [...value];>
Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.
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);>
Sortir
[ 2, 4, 6, 8, 3, 5, 7 ]>
6. Utilisation de la fonction Lodash _.concat()
Plus d’une valeur est attendue. Cela nous permet de fusionner des valeurs dans le tableau.
Syntaxe:
_.concat(array, [values]);>
Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.
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);> Sortir:
Before concat: 1,2,3 After concat: 1,2,3,0,5,a,b>
7. Utilisation de la propriété de longueur de tableau
Les tableaux JavaScript ont une propriété de longueur qui peut être utilisée pour ajouter dynamiquement des éléments à la fin d'un tableau. En attribuant une valeur à un index égale à la longueur actuelle du tableau, un nouvel élément peut être ajouté.
Exemple:
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);> Sortir
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5>