Spread: copiar, combinar y actualizar sin mutar

En arrays aprendiste a preferir lo inmutable: toSorted en vez de sort. Con objetos, la herramienta para ese estilo es el operador spread (...): tres puntos que "vuelcan" el contenido de un objeto o array dentro de otro nuevo. Con él copias, combinas y "actualizas" sin tocar jamás el original.

Volcar la caja

Spread en objetos

La regla de oro: en un choque de claves, gana la que aparece más tarde. Por eso el patrón para actualizar es siempre { ...original, campo: nuevo } — primero vuelcas todo, y al final tapas lo que quieres cambiar. Este patrón exacto es el corazón del manejo de estado en React y Redux: nunca mutar, siempre crear la versión nueva.

Spread en arrays

Rest: los tres puntos al revés

Los mismos ... en el lado IZQUIERDO de un destructuring significan lo contrario: "recoge todo lo que sobre".

¿Te suena? Es el mismo rest de los parámetros de función del módulo 3 (function total(...montos)). Truco para no confundirte: si los ... DESARMAN algo en un lugar donde se construye (objeto/array/llamada nuevos), es spread; si RECOGEN sobras donde se desempaca (destructuring/parámetros), es rest.

Mini-reto

En "Mi Bolsillo": parte de const gasto = { nombre: "Cine", valor: 25000 }. Crea gastoCompleto agregándole categoria con spread, luego gastoCorregido cambiándole el valor a 28000 (sin mutar ninguno de los anteriores), y comprueba con console.log que los tres objetos son distintos y el original sigue intacto. Cierra quitándole valor con rest.

Qué sigue

Habrás notado que insistimos en "objetos NUEVOS" y en copia === gasto dando false. Hay una razón profunda: las variables no guardan objetos, guardan REFERENCIAS a ellos — y no entender eso produce los bugs más desconcertantes de JavaScript. La próxima lección lo deja claro de una vez: referencias vs copias, y la copia profunda con structuredClone.