Gli oggetti

Nella lezione sugli array, abbiamo visto che gli array permettono di salvare una lista di elementi. Gli oggetti, in JavaScript, sono elementi che possono salvare dati ma, a differenza degli array, sono associati ad un nome (il nome della proprietà). 

Come dichiarare un oggetto

Un oggetto può essere dichiarato utilizzando le parentesi graffe. Al suo interno, si inseriscono coppie di nome e valore, con la sintassi proprietà:valore. Queste coppie sono divise dalle altre con la virgola, che può essere omessa per l'ultima proprietà.

let persona = {
  nome: "Mario",
  cognome: "Rossi",
  eta: 30
};

Come hai visto nell'esempio, con gli oggetti si possono dare delle proprietà. Ad esempio, possiamo assegnare ad una persona le proprietà nome, cognome e eta. Ad ogni proprietà viene associato un valore: in questo caso, a nome corrisponde Mario, a cognome corrisponde Rossi e a eta corrisponde 30.

Tipi di dati

Un oggetto, come gli array, può contenere qualsiasi tipo di valore, quindi stringhe, numeri, valori booleani (true o false), array, funzioni (che vedremo più avanti) e anche un altro oggetto.

let persona = {
  nome: "Mario",
  eta: 30,
  donna: false,
  figli: ["Marco", "Alice", "Martina"]
};

Le proprietà di un oggetto

Come abbiamo detto prima, le proprietà di un oggetto sono i nomi associati ai valori. Ad esempio, la proprietà altezza è associata al valore 231 nell'esempio qui sotto.

let grattacielo = {
  nome: "Torre UniCredit",
  altezza: 231,
  piani: 31
};

Ora, vediamo come visualizzare e modificare le proprietà.

Accedere ad una proprietà

Per accedere ad una proprietà, ci sono due diversi modi.

Metodo 1: utilizzare il punto

Puoi accedere ad una proprietà di un oggetto utilizzando la sintassi oggetto.proprietà. Vediamo un esempio:

let grattacielo = {
  nome: "Torre UniCredit",
  altezza: 231,
  piani: 31
};

alert(grattacielo.altezza);  // Risultato: 231

Se la proprietà di un oggetto è annidata all'interno di un altro oggetto, basta scrivere oggetto.proprietà.proprietà.

let grattacielo = {
  nome: "Torre UniCredit",
  altezza: 231,
  posizione: {
    stato: "Italia",
    regione: "Lombardia",
    citta: "Milano"
  }
};

alert(grattacielo.posizione.citta);  // Risultato: "Milano"

Metodo 2: utilizzare le parentesi quadre

Puoi accedere ad una proprietà anche utilizzando la sintassi oggetto["proprietà"] e funziona allo stesso modo del primo metodo.

let grattacielo = {
  nome: "Torre UniCredit",
  altezza: 231,
  piani: 31
};

alert(grattacielo["altezza"]);  // Risultato: 231

Anche in questo caso, se hai due oggetti annidati, basta ripetere la sintassi in questo modo: oggetto["proprietà"]["proprietà"].

let grattacielo = {
  nome: "Torre UniCredit",
  altezza: 231,
  posizione: {
    stato: "Italia",
    regione: "Lombardia",
    citta: "Milano"
  }
};

alert(grattacielo["posizione"]["citta"]);  // Risultato: "Milano"

Metodo 1 e 2 con oggetti annidati

Puoi anche utilizzare entrambi i metodi per gli oggetti annidati. La sintassi è oggetto["proprietà"].proprietà oppure oggetto.proprietà["proprietà"].

let grattacielo = {
  nome: "Torre UniCredit",
  altezza: 231,
  posizione: {
    stato: "Italia",
    regione: "Lombardia",
    citta: "Milano"
  }
};

alert(grattacielo["posizione"].citta);  // Risultato: "Milano"

Modificare il valore di una proprietà

Abbiamo visto come accedere ai valori delle proprietà. Ora, vediamo come modificarle.

Puoi modificare un valore semplicemente assegnando un altro valore alla proprietà:

let grattacielo = {
  nome: "Torre UniCredit",
  altezza: 100,
};

grattacielo.altezza = 231;

Aggiungere una proprietà ad un oggetto

Per aggiungere una proprietà ad un oggetto, si può eseguire una semplice assegnazione. Proviamo a creare un oggetto vuoto ed aggiungere la proprietà numero con valore 1.

let tavolo = { };
tavolo.numero = 1;