Objetos

Un objeto agrupa valores relacionados bajo nombres. En { name: "Coco", age: 3 }, pet.name da "Coco" y pet.age da 3.

Valores con etiqueta

Un arreglo sirve para una lista de cosas parecidas en orden. Muchas cosas del mundo se describen mejor con un conjunto de datos etiquetados: una mascota tiene un nombre, una especie y una edad; un producto tiene un título, un precio y una cantidad en existencia. Un objeto guarda exactamente eso. Es una colección de propiedades, y cada propiedad es una clave (la etiqueta) emparejada con un valor.

const pet = {
  name: "Coco",
  kind: "cat",
  age: 3,
};
console.log(pet.name);        // muestra Coco
console.log(pet["kind"]);     // muestra cat
console.log(pet.age + 1);     // muestra 4

Un objeto se escribe entre llaves, con cada propiedad como key: value y comas entre ellas. Se permite una coma final después de la última propiedad. Para leer una propiedad, escribe el objeto, un punto y la clave: pet.name. La otra forma usa corchetes y una cadena, pet["kind"]. Los corchetes hacen falta cuando la clave está guardada en una variable, como en pet[field], o cuando contiene un espacio. Leer una clave que no existe da undefined.

Cambiar y agregar propiedades

Asigna a una propiedad para cambiarla, y asigna a una clave nueva para agregarla. Como con los arreglos, esto funciona incluso cuando el objeto se declaró con const, porque la variable sigue apuntando al mismo objeto.

const player = { name: "Sam", score: 0 };
player.score += 10;
player.level = 2;
console.log(`${player.name} ${player.score} ${player.level}`);   // muestra Sam 10 2
delete player.level;
console.log(player.level);   // muestra undefined

Listas de objetos

Los arreglos y los objetos se combinan con naturalidad. Un arreglo de objetos es la forma en que la mayoría de los programas guardan registros: una canasta de compras, una lista de clase, un conjunto de resultados de búsqueda. Recorres el arreglo y lees de cada objeto las propiedades que necesitas.

const basket = [
  { item: "pen", price: 2 },
  { item: "book", price: 12 },
  { item: "bag", price: 25 },
];
let total = 0;
for (const line of basket) {
  total += line.price;
}
console.log("Total:", total);   // muestra Total: 39

Los valores dentro de un objeto pueden ser cualquier cosa, incluidos arreglos y otros objetos. const user = { name: "Ana", tags: ["admin", "editor"] }; te permite escribir user.tags[0] para llegar a "admin". Lee esas cadenas de izquierda a derecha: empieza en user, ve a su propiedad tags y luego toma el índice 0.

Métodos y las claves de un objeto

Una propiedad cuyo valor es una función se llama método. Has estado llamando métodos todo el tiempo: console.log es el método log del objeto console, y Math.round es el método round de Math. Dentro de un método, la palabra clave this se refiere al objeto sobre el que se llamó el método, así que un método puede leer las propiedades de su propio objeto. Por último, Object.keys(pet) da un arreglo con las claves, aquí ["name", "kind", "age"], algo útil para recorrer todas las propiedades.

const counter = {
  count: 0,
  add() {
    this.count++;
  },
};
counter.add();
counter.add();
console.log(counter.count);   // muestra 2

Ejemplo resuelto. Un registro de libro { title: "Notes", pages: 120, read: 45 } puede informar su avance con Math.round(book.read / book.pages * 100), que da 38, es decir, el 38 por ciento. Ponerles nombre a los valores, pages y read, hace que la fórmula se lea de una manera en que b[1] / b[0] nunca se leería.

¿Arreglo u objeto?

Una prueba rápida decide cuál usar. Si los valores son el mismo tipo de cosa y su orden importa, como las calificaciones de una clase o los pasos de una receta, usa un arreglo y llega a ellos por posición. Si los valores son datos distintos sobre una misma cosa, como el nombre, el precio y la existencia de un producto, usa un objeto y llega a ellos por nombre. La mayoría de los datos reales mezclan las dos cosas: un arreglo de productos, donde cada producto es un objeto. Cuando imprimes un objeto en el cuadro de práctica, lo verás en forma compacta, como {"name":"Coco","age":3}; leer propiedades sueltas da una salida más limpia.