Obiekty: mapa klucz-wartość

Obiekt (object) w JS to nieuporządkowany zbiór par klucz → wartość. Kluczami są stringi (lub Symbol), a wartościami może być cokolwiek: liczby, stringi, tablice, inne obiekty, funkcje. Jest to najczęściej używana struktura danych w tym języku: każdy „rekord” w Twoim kodzie będzie zazwyczaj obiektem.

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

Odczytywanie właściwości: dot vs bracket

Istnieją dwa równoważne sposoby zapisu:

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

Brakująca właściwość zwraca undefined, bez rzucania błędów:

utente.telefono; // undefined

Dodawanie, modyfikowanie, usuwanie

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

delete jest słowem kluczowym (keyword). Z czasem stanie się rzadkim przypadkiem użycia: w większości przypadków będziesz chciał stworzyć nowy obiekt bez danego klucza (przyjrzymy się temu w lekcji o operatorze spread).

Shorthand: klucze o takiej samej nazwie jak zmienne

Gdy nazwa klucza pokrywa się z nazwą zmiennej, możesz pominąć powtórzenie:

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

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

Sprawdzanie obecności właściwości

Trzy opcje, w kolejności preferencji:

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

Spróbuj sam

Ćwiczenie#js.m3.l2.e1

Próby: 0Ładowanie...

Utwórz obiekt user = { name: 'Sara', age: 22 }, następnie dodaj właściwość 'active' ustawioną na true i zwróć ten obiekt jako ostatnie wyrażenie.

Ładowanie edytora...

Pokaż wskazówkę

Możesz dodawać właściwości później za pomocą zapisu z kropką (dot notation).

Rozwiązanie dostępne po 3 próbach

Ćwiczenie powtórzeniowe

Ćwiczenie#js.m3.l2.e2