Saltar al contenido principal
eLearner.app
Módulo 3 · Lección 2 de 410/32 en el curso~10 min
Lecciones del módulo (2/4)

Objetos: el mapa de clave-valor

Un objeto en JS es una colección no ordenada de pares clave → valor. Las claves son cadenas (o Symbol), los valores son cualquier cosa: números, cadenas, arrays, otros objetos, funciones. Es la estructura de datos más utilizada del lenguaje: cada "registro" de tu dominio será típicamente un objeto.

JS
const utente = {
  nome: 'Anna',
  eta: 28,
  attivo: true,
  ruoli: ['admin', 'editor'],
};

Leer propiedades: dot vs bracket

Existen dos notaciones equivalentes:

JS
utente.nome; // 'Anna'    (dot — la forma normale)
utente['nome']; // 'Anna'    (bracket — equivalente)

// Le bracket sono OBBLIGATORIE quando:
// 1) la chiave non è un identificatore valido
const tag = { 'codice-fiscale': 'ABC123' };
tag['codice-fiscale']; // OK
// tag.codice-fiscale;      // errore di sintassi

// 2) la chiave è calcolata (variabile/espressione)
const campo = 'eta';
utente[campo]; // 28

Una propiedad inexistente devuelve undefined, sin errores:

JS
utente.telefono; // undefined

Añadir, modificar, eliminar

JS
const u = { nome: 'Anna' };
u.eta = 28; // aggiunge
u.nome = 'Anna B.'; // modifica
delete u.eta; // rimuove la proprietà

delete es una palabra clave (keyword). Acabará siendo un caso de uso raro: en la mayoría de los casos querrás producir un nuevo objeto sin esa clave (lo veremos con el spread).

Shorthand: claves que se llaman como la variable

Cuando el nombre de la clave coincide con el de la variable, puedes omitir la duplicación:

JS
const nome = 'Anna';
const eta = 28;

const u1 = { nome: nome, eta: eta }; // forma esplicita
const u2 = { nome, eta }; // shorthand, equivalente

Comprobar la presencia de una propiedad

Tres opciones, en orden de preferencia:

JS
'nome' in utente; // true   ← operatore in
utente.nome !== undefined; // true   ← funziona quasi sempre
Object.hasOwn(utente, 'nome'); // true   ← moderno, sicuro

Pruébalo tú mismo

Ejercicio#js.m3.l2.e1
Intentos: 0Cargando...

Crea el objeto user = { name: 'Sara', age: 22 }, luego añade la propiedad 'active' a true y devuelve el objeto como última expresión.

Cargando editor...
Mostrar pista

Puedes añadir propiedades a posteriori con la dot notation.

Solución disponible después de 3 intentos

Ejercicio de repaso

Ejercicio#js.m3.l2.e2
Intentos: 0Cargando...

Dado `product = { code: 'A1', price: 9.9 }` y la cadena `key = 'price'`, devuelve el precio usando la notazione de corchetes (la última expresión debe evaluar a 9.9).

Cargando editor...
Mostrar pista

Con los corchetes puedes pasar una variable como clave.

Solución disponible después de 3 intentos