JavaScript: cómo insertar elementos en un índice específico de una matriz

    Introducción

    Una matriz es una estructura de datos lineal y posiblemente una de las estructuras de datos más populares utilizadas en la informática. La modificación de una matriz es una operación común. Aquí, discutiremos cómo agregar un elemento en cualquier posición de una matriz en JavaScript.

    Se puede agregar un elemento a una matriz en tres lugares:

    • Inicio / Primer elemento
    • Fin / Último elemento
    • En cualquier otro lugar

    ¡Comencemos agregando elementos al comienzo de una matriz!

    Agregar elementos al inicio de una matriz

    los unshift() El método en objetos de matriz agrega uno o más elementos al inicio de una matriz. Cuando se ejecuta, también devuelve la nueva longitud de una matriz:

    const startArray = [3, 4, 5];
    const newLength = startArray.unshift(2);
    console.log(newLength);
    console.log(startArray);
    
    startArray.unshift(-1, 0, 2);
    console.log(startArray);
    

    Lo que nos da el resultado esperado:

    4
    [ 2, 3, 4, 5 ]
    [ -1, 0, 2, 2, 3, 4, 5 ]
    

    Agregar elementos al final de una matriz

    Usando el último índice de la matriz

    Para agregar un elemento al final de una matriz, podemos usar el hecho de que la longitud de una matriz es siempre uno menos que el índice.

    Digamos que la longitud de una matriz es 5, luego el último índice en el que el valor será 4. Entonces, podemos agregar directamente el elemento en el last+1 índice. Echemos un vistazo:

    const indexArray = [1, 2, 3];
    console.log(indexArray.length);
    console.log(indexArray[2]);
    console.log(indexArray[3]);
    
    indexArray[indexArray.length] = 4
    console.log(indexArray);
    

    Ejecutar esto en una consola JS muestra:

    3
    3
    undefined
    [ 1, 2, 3, 4 ]
    

    La matriz es 3 de longitud, y el segundo elemento es 3. No hay un tercer elemento, así que nos saludan undefined. Finalmente, en esa posición, insertamos el valor de 4.

    El método push ()

    los push() El método de una matriz agrega uno o más elementos al final de la misma. Al igual que unshift(), también devuelve la nueva longitud de la matriz:

    const pushArray = [1, 2, 3]
    const newLength = pushArray.push(4, 5, 6, 7);
    console.log(newLength);
    console.log(pushArray);
    

    Ejecutar el código anterior mostrará esto:

    7
    [ 1, 2, 3, 4, 5, 6, 7 ]
    

    El método concat ()

    La fusión o unión de dos o más matrices se logra mediante un sistema concat() método. Crea un nueva copia de la salida y no afecta las matrices originales. A diferencia de los métodos anteriores, devuelve una nueva matriz. Los valores que se concatenan siempre vienen al final de la matriz usando el método.

    Podemos concatenar una matriz con otra matriz:

    const example1Array1 = [1, 2, 3];
    const valuesToAdd = [4, 5, 6];
    const example1NewArray = example1Array1.concat(valuesToAdd);
    
    console.log(example1NewArray);
    console.log(example1Array1);
    

    Que imprime esta salida:

    [ 1, 2, 3, 4, 5, 6 ]
    [ 1, 2, 3 ]
    

    Podemos concatenar una matriz con una secuencia de valores:

    const array = [1,2,3];
    const newArray = array.concat('12', true, null, 4,5,6,'hello');
    console.log(array);
    console.log(newArray);
    

    Ejecutar el código anterior registrará esto en nuestras consolas:

    [ 1, 2, 3 ]
    [ 1, 2, 3, '12', true, null, 4, 5, 6, 'hello' ]
    

    Podemos concatenar una matriz con varias matrices:

    const array1 = [1, 2, 3];
    const array2 = [4, 5, 6];
    const array3 = [7, 8, 9];
    const oneToNine = array1.concat(array2, array3);
    
    console.log(oneToNine);
    

    Cuando se ejecuta, el código anterior imprime una lista de números del 1 al 9:

    [ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]
    

    Agregar elementos en cualquier lugar de una matriz

    Ahora discutiremos un método de trazo maestro que se puede usar para agregar un elemento en cualquier lugar de una matriz: inicio, final, medio y en cualquier otro lugar intermedio.

    los splice() El método agrega, elimina y reemplaza elementos en una matriz. Se utiliza habitualmente para la gestión de matrices. Este método no crea una nueva matriz, sino que actualiza la que la llamó.

    Veamos splice() en acción. Vamos a tomar una serie de días de la semana y agregar un elemento “miércoles” entre “martes” y “jueves”:

    const weekdays = ['monday', 'tuesday', 'thursday', 'friday']
    const deletedArray = weekdays.splice(2, 0, 'wednesday');
    
    console.log(weekdays);
    console.log(deletedArray);
    

    El código anterior registra esto en la consola:

    [ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday' ]
    []
    

    Analicemos el código anterior. Queríamos agregar ‘miércoles’ en el weekdays matriz en el 2do posición. No es necesario eliminar ningún elemento aquí. El código weekdays.splice(2, 0, 'wednesday') se lee como en la segunda posición, no elimine ningún elemento y agregue wednesday.

    Aquí está la sintaxis general para usar splice():

    let removedItems = array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
    

    Dónde:

    • start – El índice en el que comenzar a modificar la matriz.
    • deleteCount – El número opcional de elementos de la matriz para eliminar start. Si se omite, todos los elementos posteriores start será borrado.
    • item1, item2, ... – Los elementos opcionales para agregar a la matriz desde start. Si se omite, solo eliminará elementos de la matriz.

    Veamos otro ejemplo de slice() donde agregamos y eliminamos a la matriz al mismo tiempo. Agregaremos “miércoles” en la segunda posición, sin embargo, también eliminaremos los valores de fin de semana erróneos allí:

    const weekdays = ['monday', 'tuesday', 'saturday', 'sunday', 'thursday', 'friday']
    const deletedArray = array.splice(2, 2, 'wednesday');
    
    console.log(weekdays);
    console.log(deletedArray);
    

    El código anterior se imprimirá:

    [ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday' ]
    [ 'saturday', 'sunday' ]
    

    En el ejemplo anterior, array.splice(2, 2, 'wednesday') elimina dos elementos de la segunda posición (inicio) y agrega ‘miércoles’ allí. Que justo ahí está el poder de slice()!

    Conclusión

    En este artículo, analizamos muchas formas en JavaScript en las que podemos agregar elementos a una matriz. Podemos agregarlos al principio con unshift(). Podemos agregarlos al final usando su índice, el pop() método y el concat() método. Tenemos aún más control de dónde los colocamos con el splice() método.

     

    Etiquetas:

    Deja una respuesta

    Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *