Objecten: de sleutelwaardekaart

Een object in JS is een ongeordende verzameling van sleutel → waarde-paren. Sleutels zijn strings (of Symbol), waarden zijn van alles: getallen, strings, arrays, andere objecten, functies. Het is de meest gebruikte datastructuur in de taal: elk "record" in uw domein zal doorgaans een object zijn.

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

Leeseigenschappen: punt versus haakje

Er zijn twee gelijkwaardige notaties:

utente.nome; // 'Anna'    (dot — the normal form)
utente['nome']; // 'Anna'    (bracket — equivalent)

// Brackets are MANDATORY when:
// 1) the key is not a valid identifier
const tag = { 'codice-fiscale': 'ABC123' };
tag['codice-fiscale']; // OK
// tag.codice-fiscale;      // syntax error

// 2) the key is computed (variable/expression)
const campo = 'eta';
utente[campo]; // 28

Een ontbrekende eigenschap retourneert undefined, zonder fouten:

utente.telefono; // undefined

Toevoegen, wijzigen, verwijderen

const u = { nome: 'Anna' };
u.eta = 28; // adds
u.nome = 'Anna B.'; // modifies
delete u.eta; // removes the property

delete is een trefwoord. Het zal een zeldzame use case blijken te zijn: de meeste van de keer dat je een nieuw object wilt maken zonder die sleutel (we zullen dit zien met spreiding).

Afkorting: toetsen met de naam van de variabele

Wanneer de sleutelnaam overeenkomt met de naam van de variabele, kunt u de duplicatie weglaten:

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

const u1 = { nome: nome, eta: eta }; // explicit form
const u2 = { nome, eta }; // shorthand, equivalent

Controle op de aanwezigheid van een woning

Drie opties, in volgorde van voorkeur:

'nome' in utente; // true   ← in operator
utente.nome !== undefined; // true   ← works almost always
Object.hasOwn(utente, 'nome'); // true   ← modern, safe

Probeer het

Oefening beoordelen