Objetos en JavaScript: propiedades, métodos y destructuring
Crear objetos, acceder a propiedades, métodos y this, desestructuración, spread y Object.keys/values/entries, con laboratorios interactivos.
Un objeto agrupa datos relacionados en pares clave: valor. Es la
estructura más usada de JavaScript (los datos de una API llegan como objetos).
JavaScript
const persona = {
nombre: "Ana",
edad: 30,
saludar() { return `Hola, soy ${this.nombre}`; }
};
persona.nombre; // "Ana"
persona["edad"]; // 30
persona.saludar(); // "Hola, soy Ana"
Desestructuración
Sacar propiedades de un objeto a variables sueltas, en una línea.
JavaScript
const { nombre, edad, ciudad = "Desconocida" } = persona;
// nombre = "Ana", edad = 30, ciudad = "Desconocida" (valor por defecto)
Laboratorio: destructuring interactivo
…
spread: copiar y combinar
Laboratorio: {...a, ...b} interactivo
…
Si una clave está en los dos, gana la del último. Muy usado para
actualizar estado:
{ ...usuario, edad: 31 }.Object.keys / values / entries
Laboratorio interactivo
…
Comprueba lo aprendido
Tras
const { edad } = { nombre: "Ana", edad: 30 };, ¿qué vale edad?{ ...{x:1, y:2}, ...{y:9} } es…Object.keys({a:1, b:2}) devuelve…