El Spread Operator Parte 1
Parte de la sección Lógica y Flujo del Journey de JavaScript de Coddy — lección 18 de 65.
El operador spread (...) tiene muchos casos de uso para JSON. Por ejemplo, al realizar la siguiente operación:
const obj1 = {key1: "123"}
const obj2 = obj1
obj1.key1 = "456
console.log(obj2.key1)¿Cuál sería el resultado?
console.log(obj2.key1)
// Salida: "456"¡Esto podría ser sorprendente! Aunque solo cambiamos obj1, obj2 también cambió.
Esto sucede porque cuando asignamos objetos directamente (obj2 = obj1), estamos creando una referencia, no una copia. Ambas variables apuntan al mismo objeto en memoria.
Aquí es donde el operador spread resulta útil. Veamos cómo crear una copia real:
const obj1 = {key1: "123"};
const obj2 = {...obj1};
obj1.key1 = "456";
console.log(obj2.key1);
// Salida: "123"El operador spread crea un nuevo objeto y copia todas las propiedades enumerables del objeto de origen en el nuevo.
Ponte a pruebaEsta lección incluye un breve cuestionario. Empieza la lección para responderlo y registrar tu progreso.
Ponte a pruebaEsta lección incluye un breve cuestionario. Empieza la lección para responderlo y registrar tu progreso.
Hoja de referencia
El operador spread (...) crea una copia de un objeto en lugar de una referencia:
// Referencia (ambas variables apuntan al mismo objeto)
const obj1 = {key1: "123"}
const obj2 = obj1
obj1.key1 = "456"
console.log(obj2.key1) // Output: "456"// Copia usando el operador spread
const obj1 = {key1: "123"}
const obj2 = {...obj1}
obj1.key1 = "456"
console.log(obj2.key1) // Output: "123"El operador spread copia todas las propiedades enumerables del objeto de origen en un nuevo objeto.
Pruébalo tú mismo
Esta lección no incluye un desafío de código.
Ponte a pruebaEsta lección incluye un breve cuestionario. Empieza la lección para responderlo y registrar tu progreso.
Todas las lecciones de Lógica y Flujo
1Strings en profundidad
Fundamentos de stringsIterar sobre stringsTemplate LiteralsMétodos de stringsResumen - String Weaver4JSON Parte 2
Iterar sobre JSONJSON anidadoEncadenamiento opcional en JSONCopia superficial y profundaResumen - Tienda de bicicletasResumen - Sistema solar7Sistema de Gestión de Biblioteca
Descripción general del proyectoAñadir libros
Buscar por títuloFiltrar por géneroMarcar como leído10Gestionar el sistema del festival
Descripción general del proyectoAñadir películas y sedesAñadir proyeccionesComprar entradasCalificar películasCancelar proyecciones2Arreglos multidimensionales
Conceptos básicos de arreglos 2DAcceso a elementos de arreglos 2DBucles anidados con arreglos 2DResumen - Arreglos 2DSuma y resta de matricesArreglos irregulares (Jagged Arrays)Arreglos 3D y más alláPatrones comunes en arreglos 2DResumen - Todo sobre arreglos5Conjuntos Parte 1
¿Qué es un conjunto?Iterar sobre conjuntosAñadir un elementoEliminar un elementoComprobar si un elemento existeTamaño y Is EmptyCopy y ClearResumen - Conceptos básicos de conjuntos8Temas interesantes de Arrays
Desestructuración de ArraysSintaxis Spread en ArraysArrays dispersosResumen - Taller de Arrays3JSON Parte 1
¿Qué es un JSON?Comprobar si existe una claveMétodos de objetoEl Spread Operator Parte 1El Spread Operator Parte 2Eliminar clavesResumen - Manipular claves de JSON