Lección 10 · 10 de 20

Objetos · JavaScript

Agrupe datos en objetos de JavaScript: propiedades clave: valor, punto y corchetes, añadir y borrar, Object.keys, for...in y arrays de objetos.

JavaScript · Objetos en DMarlon Studio: el código del ejemplo y su salida en la terminal

Un objeto reúne datos relacionados en pares clave: valor entre llaves. El libro tiene title, author, year y available, cada uno con su valor; a cada par se le llama propiedad.

Una propiedad se lee con un punto, book.title, o con corchetes y una cadena, book[field]. Los corchetes sirven cuando el nombre de la clave está en una variable, como field.

Las propiedades se cambian y se añaden asignándoles un valor (book.available = false, book.pages = 412) y se borran con `delete`. El operador in dice si existe una clave y `Object.keys()` devuelve todas en un array.

`for...in` recorre las claves de un objeto; con book[key] se obtiene el valor de cada una. No lo confunda con for...of, que recorre los valores de un array.

Lo más habitual es un array de objetos: cada alumno es un objeto con name y grade, y for...of los recorre uno a uno. Es la misma forma que tienen los datos que maneja una aplicación React o Next.js hecha con DMarlon Studio.

Código · main.js

// An object groups related data as key: value pairs.const book = {  title: "Dune",  author: "F. Herbert",  year: 1965,  available: true,};console.log(book);// Read a property with a dot, or with brackets and a string.const field = "year";console.log("Title:", book.title, "| Year:", book[field]);// Change, add and delete properties.book.available = false;book.pages = 412;delete book.year;console.log(book);console.log("Has pages?", "pages" in book, "| Keys:", Object.keys(book));// for...in goes through the keys of an object.for (const key in book) {  console.log(`  ${key}: ${book[key]}`);}// An array of objects: the usual way to keep records.const students = [  { name: "Lucia", grade: 8.5 },  { name: "Mario", grade: 6 },];for (const s of students) console.log(`${s.name} got ${s.grade}`);

Salida · node main.js

{ title: 'Dune', author: 'F. Herbert', year: 1965, available: true }
Title: Dune | Year: 1965
{ title: 'Dune', author: 'F. Herbert', available: false, pages: 412 }
Has pages? true | Keys: [ 'title', 'author', 'available', 'pages' ]
  title: Dune
  author: F. Herbert
  available: false
  pages: 412
Lucia got 8.5
Mario got 6

Para recordar

Un objeto guarda pares clave: valor.
obj.clave u obj["clave"] para leer; = para cambiar o añadir.
delete borra una propiedad; in comprueba si existe.
Object.keys() da las claves; for...in las recorre.

Ejercicio

Cree un objeto car con marca, modelo y kilómetros; súmele 1500 kilómetros, añádale un color, escriba todas sus propiedades con for...in y cuántas tiene con Object.keys().