En artículos anteriores, he cubierto que Javascript almacena objetos y arreglos en almacenamiento dinámico. Eso significa que una matriz se crea una vez, y luego cualquier actualización en el futuro actualizará esa matriz original. Por ejemplo: let myArray = [ 1, 2, 3 ]; let newArray = myArray; newArray[0] = 2; // Both return [ 2, 2, 3 ] console.log(newArray, myArray); Como tal, a menudo nos encontramos haciendo copias o clonando arreglos para hacer cambios en ellos sin afectar el original. Una forma común de hacerlo es con : el operador de tres puntos let myArray = [ 1, 2, 3]; let newArray = [...myArray]; newArray[0] = 2; // Returns [ 2, 2, 3 ] and [ 1, 2, 3 ] console.log(newArray, myArray); Dado que la clonación es tan común, que ha llegado a la etapa 3, que nos brindará una gran cantidad de nuevas formas de copiar y luego cambiar una matriz. Esta propuesta se denomina propuesta . Echemos un vistazo a cómo funciona. se ha escrito una nueva especificación "Cambiar matriz por copia" Apoyo Actualmente, estas características no son compatibles con ningún navegador principal o versión de Node.JS. Sin embargo, podemos esperar que sean compatibles pronto, ya que esta especificación ha alcanzado la Etapa 3 en el proceso de propuesta de Javascript. Esta sección se actualizará a medida que cambie el soporte. Dicho esto, existe un para recrear el comportamiento de esta propuesta, que puedes usar hoy. polyfill Nueva matriz de cambios por métodos de copia La nueva propuesta agrega 4 nuevos métodos que una matriz y luego la cambiarán de alguna manera. Estos son: copiarán - clona una matriz y luego la invierte Array.prototype.toReversed() - clone una matriz y luego ordénela. Array.prototype.toSorted(compareFn) - clone una matriz y empalme de alguna manera. Array.prototype.toSpliced(start, deleteCount, ...items) - clona una matriz y agrega un nuevo elemento en algún lugar dentro de ella. Array.prototype.with(index, value) Todos estos métodos también funcionarán en datos de , por ejemplo, . TypedArray Int8Array al revés() hace exactamente lo que dice: toma una matriz y la invierte. Dado que esta función clona la matriz, no necesitamos hacer ninguna copia para crear una nueva versión de nuestra matriz original: toReversed let x = [ 1, 2, 3 ]; let y = x.toReversed(); // Returns [ 1, 2, 3 ], [ 3, 2, 1 ] console.log(x, y); ordenados() , es una versión no destructiva de , lo que significa que no altera la matriz original. Por defecto, tomará una matriz y la ordenará numéricamente. Por ejemplo: toSorted sort() let x = [ 5, 3, 4, 2, 1 ]; let y = x.toSorted(); // [ 1, 2, 3, 4, 5 ] También acepta una función de comparación, que funciona igual que el método en Javascript y es útil cuando se trabaja con una matriz de objetos. Por ejemplo: sort() let x = [ { value: 0 }, { value: 4 }, { value: 2 }, { value: 3 } ]; // y becomes: // [ // { value: 0 }, // { value: 2 }, // { value: 3 }, // { value: 4 } // ] let y = x.toSorted((a, b) => { return a.value - b.value }); empalmado() es una versión no destructiva de , lo que significa que no altera la matriz original. Acepta tres argumentos: toSpliced() splice() - la posición en la que empezar. start - el número de elementos a eliminar. deleteCount : cualquier elemento para insertar en la posición de inicio después de la eliminación. ...items Por ejemplo: let x = [ "Dog", "Cat", "Zebra", "Bat", "Tiger", "Lion" ]; // y is [ "Dog", "Snake", "Bat", "Tiger", "Lion" ] let y = x.toSpliced(1, 2, "Snake"); // z is [ "Dog, "Tiger", "Lion" ] let z = x.toSpliced(1, 3); es un ejemplo perfecto de cómo estas funciones de copia son útiles: usando el método original, eliminaríamos elementos de y los cambiaríamos permanentemente. Usando , podemos cambiar muchas veces, sin preocuparnos de que cambie su contenido. Lo anterior splice() x toSpliced() x con() Finalmente, tenemos , que simplemente cambia un elemento en una matriz existente. En esencia, tome la matriz y muéstrela otra cosa. Aquí hay un ejemplo de esto en acción. with() A with let x = [ "Dog", "Cat", "Lizard" ] // y is now [ "Dog", "Zebra", "Lizard" ] let y = x.with(1, "Zebra") // z is now [ "Tiger", "Cat", "Lizard" ] let z = x.with(0, "Tiger") Una vez más, , sin tener que crear una copia cada vez. hemos podido crear varias matrices nuevas a partir de una matriz inicial Conclusión Estas adiciones de matrices son bastante poco controvertidas y muy necesarias para un lenguaje que normalmente mantiene solo una copia de una matriz u objeto. Usando estos nuevos métodos, Javascript elimina la confusión y la complejidad del código. Aunque no es un cambio tan grande como algo como , sigue siendo una adición bienvenida al idioma. Temporal También publicado aquí

Mozilla

2022 - HackerNoon Contributor of the Year - Coding

2022 - HackerNoon Contributor of the Year - Coding Skills

2022 - HackerNoon Contributor of the Year - Java

2022 - HackerNoon Contributor of the Year - Javascript

2022 - HackerNoon Contributor of the Year - Website Development

2022 - Tip Your Hat Tutorials Best Tutorials

Coding Guru of 2022

Nominated for 2022 - HackerNoon Contributor of the Year - Javascript

Nominated for 2022 - HackerNoon Contributor of the Year - Coding

Nominated for 2022 - HackerNoon Contributor of the Year - Coding Skills

Nominated for 2022 - Tip Your Hat Tutorials Best Tutorials

Nominated for 2022 - HackerNoon Contributor of the Year - Java

Nominated for 2022 - HackerNoon Contributor of the Year - Website Development

Nominated for Coding Guru of 2022

Nominated for 2022 - HackerNoon Contributor of the Year - Typescript

Este audio es producido en el idioma original de la historia!

Demasiado Largo; Para Leer

Let Your Engineers & PMs focus on Product. Apply for $50K Credits!

Los métodos de matriz llegarán a JavaScript en 2022

Los métodos de matriz llegarán a JavaScript en 2022

Demasiado Largo; Para Leer

Company Mentioned

@smpnjn

HISTORIAS RELACIONADAS