Operaciones con objetos

<< Herencia Módulos >>

Desestructuración de objetos

Al igual que sucede con los arrays, también es posible desestructurar objetos (extraer parejas propiedad:valor). El funcionamiento es similar a desestructurar un array, pero usamos llaves '{ }' en lugar de corchetes.

let usuario = {
    id: 3,
    nombre: "Pedro",
    email: "peter@gmail.com"
}

let {id, nombre, email} = usuario;
console.log(nombre); // Imprime "Pedro"

// Se pueden asignar variables con nombres diferentes a los atributos
let {nombre: nombreUsuario, email: emailUsuario} = usuario;
console.log(nombreUsuario); // Imprime "Pedro"

// Esta función recibirá un objeto como primer parámetro y lo desestructurará en variables
function imprimirUsuario({id, nombre, email}, otraInfo = "Nada") {
    // Cuerpo de la función
}

otraInfo(usuario, "Es muy listo");

Spread de objetos

Podemos utilizar el operador spread '...' con objetos para clonar objetos, o crear nuevos objetos combinando las propiedades de 2 o más objetos. Cuando hay propiedades repetidas en ambos objetos, el valor del último objeto prevalece.

function configGame(options) {
    let defaults = {
        name: "Player 1",
        level: 1,
        difficulty: "normal",
        gender: "female"
    };

    let config = {...defaults, ...options}; // Combinamos el objeto defaults con options
    console.log(config);
}

let options = {
    name: "Super Master",
    gender: "male"
};
configGame(options); // {name: "Super Master", level: 1, difficulty: "normal", gender: "male"}

Concatenación opcional (?.)

El operador ?. funciona de manera similar al operador de encadenamiento de propiedades (.), pero con una diferencia clave: si en algún punto de la secuencia se encuentra una referencia null o undefined, la expresión se cortocircuita y devuelve ese valor (null o undefined) inmediatamente, en lugar de lanzar un error que detendría la ejecución del programa.

La sintaxis de concatenación opcional se puede aplicar de tres maneras:

  • Acceso a propiedades de objetos: objeto?.propiedad
  • Acceso a elementos de un array: array?.[indice]
  • Llamadas a funciones o métodos: funcion?.(parámetros)
const coche = {
  marca: 'Ford',
  modelo: 'Mustang',
  // motor: {
  //   cilindros: 8
  // }
};

const cilindros = coche?.motor?.cilindros;
console.log(cilindros); // undefined (no hay error)

Combinar con el Operador de Coalescencia Nula (??)

El encadenamiento opcional se complementa perfectamente con el operador de coalescencia nula (??). Este último permite proporcionar un valor predeterminado en caso de que una expresión resulte null o undefined.

const configuracion = {
  // tema: { 
  //   color: 'oscuro'
  // }
};

const temaActual = configuracion.tema?.color ?? 'claro'; // configuracion.tema devuelve "undefined"

console.log(temaActual); // "claro"

<< Herencia Módulos >>