¿Cómo agregar un elemento en una matriz en JavaScript?
Agregar un elemento a una matriz en JavaScript significa agregar un nuevo elemento al final de la matriz. , este proceso extiende la longitud de la matriz y acomoda nuevos datos. JavaScript ofrece varios métodos para agregar elementos que aceptan uno o más elementos como argumentos y los agrega al final de la matriz.
Estas son las siguientes formas de resolver el problema:
Tabla de contenidos
- Usando el método JavaScript push()
- Usando el método JavaScript unshift()
- Usando el método de empalme() de JavaScript
- Usando el método concat() de JavaScript
- Operador de extensión de JavaScript
- Usando la función Lodash _.concat()
- Usando la propiedad de longitud de la matriz
1. Usando el método JavaScript push()
Método JavaScript push() agregará un elemento al final de una matriz, mientras que su función gemela, la método pop() , eliminará un elemento del final de la matriz. Si necesita agregar uno o varios elementos al final de una matriz, el método empujar() Casi siempre será tu opción más sencilla y rápida.
Sintaxis:
array.push(item1, item2, ..., itemX)
Ejemplo: En este ejemplo, agregaremos nuevos elementos al final de la matriz usando el método 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); Producción
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5,Geeks6
2. Usando el método JavaScript unshift()
Método JavaScript unshift() agregará un elemento al comienzo de una matriz, mientras que su función gemela, shift(), eliminará un elemento del comienzo de la matriz.
Sintaxis:
array.unshift(item1, item2, ..., itemX)
Ejemplo: En este ejemplo, agregaremos nuevos elementos al comienzo de la matriz usando el método 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); Producción
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks5,Geeks6,Geeks1,Geeks2,Geeks3,Geeks4
3. Usando el método empalme() de JavaScript
Método de empalme de JavaScript() modifica el contenido de una matriz eliminando elementos existentes y/o agregando nuevos elementos.
Sintaxis:
array.splice(index, amount, item1, ....., itemX)
Ejemplo: En este ejemplo, agregaremos nuevos elementos en el tercer índice de la matriz usando el método 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); Producción
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks5,Geeks6,Geeks4
4. Usando el método concat() de JavaScript
Método JavaScript concat() devuelve una nueva matriz combinada compuesta por la matriz en la que se llama, unida a la matriz (o matrices) de su argumento. Este método se utiliza para unir dos o más matrices y este método no cambia las matrices existentes, sino que devuelve una nueva matriz que contiene los valores de las matrices unidas.
Sintaxis:
array1.concat(array2, array3, ..., arrayX)
Ejemplo: En este ejemplo, fusionaremos tres matrices usando el método 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);
Producción
[ 'Geeks1', 'Geeks2', 'Geeks3', 'Geeks4', 'GeeksForGeeks' ]
5. Operador de extensión de JavaScript
Operador de extensión de JavaScript permite que un iterable se expanda en lugares donde se esperan 0+ argumentos. Se utiliza principalmente en la matriz de variables donde se espera más de 1 valor. Nos permite el privilegio de obtener una lista de parámetros de una matriz.
Sintaxis:
let variablename1 = [...value];
Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.
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);
Producción
[ 2, 4, 6, 8, 3, 5, 7 ]
6. Usando la función Lodash _.concat()
Se espera más de 1 valor. Nos permite fusionar valores en la matriz.
Sintaxis:
_.concat(array, [values]);
Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.
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); Producción:
Before concat: 1,2,3 After concat: 1,2,3,0,5,a,b
7. Usando la propiedad de longitud de la matriz
Las matrices de JavaScript tienen una propiedad de longitud que se puede utilizar para agregar elementos al final de una matriz de forma dinámica. Al asignar un valor a un índice que sea igual a la longitud actual de la matriz, se puede agregar un nuevo elemento.
Ejemplo:
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); Producción
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5