Guida a Javascript: Gli oggetti

Dopo aver preso conoscenza di Variabili e Funzioni si può parlare degli Oggetti.
In JavaScript gli oggetti sono delle entità ibride poiché possono raggruppare in gruppi logici variabili e funzioni attinenti ad un certo sottoinsieme. Ad esempio potremo avere un oggetto che riguarda le persone e un’altro che riguarda la frutta. Gli Oggetti offrono il raggruppamento tramite proprietà (variabili accessibili solo esclusivamente attraverso l’oggetto) e metodi (funzioni accessibili solo esclusivamente tramite l’oggetto).

La sintassi di base per creare un nuovo oggetto è:

// creo un nuovo oggetto
var Persone = new Object();

Nota: la variabile, come abbiamo visto nel capitolo relativo, vengono sempre con la prima lettera minuscola, e solo nelle parole composte si usa la maiuscola. Ad esempio automobili oppure automobiliFerrari. Nel caso di un oggetto, sebbene venga dichiarata la variabile, questo inizia sempre con una lettera maiuscola! Si tratta di una convenzione accettata in modo universale per cui è bene rispettarla.

Dopo la dichiarazione si potrà aggiungere le sopra citate proprietà e metodi. Queste vengono istanziate come sottoinsiemi e sono distinte da un punto. Vediamo un esempio:

var Persone = new Object();

Persone.nome = "Mario Rossi";

Persone.dati = function() {
  return Persone.nome;
}

Dopo aver dichiarato l’oggetto, creiamo una proprietà chiamata nome e un metodo chiamato dati. Queste proprietà (variabili) e metodi (funzioni) sono fruibili solo dall’oggetto Persone. Come già detto negli altri articoli, in JavaScript si cerca di bignamizzare quanto più possibile. La cosa riportata sopra la potremo scrivere:

var Persone = {
  nome :"Mario Rossi",
  dati : function(){
     return Persone.nome;
  }
};

In questo caso pongo l’evidenza sulla punteggiature. Persone  come oggetto è stato dichiarato in automatico attraverso l’utilizzo dell’assegnazione di qualcosa all’interno delle parentesi graffe. Le proprietà vengono assegnati i valori con il doppio punto. La suddivisione tra loro avviene attraverso la virgola e non il punto e virgola. Inoltre le Proprietà possono essere annidate sotto altre proprietà. Vediamo un esempio di simil – anagrafica e come richiamare i dati.

var Anagrafica = {
  nome : "Mario",
  cognome: "Rossi",
  residenza: {
     indirizzo: "Via Nazionale",
     civico: 30,
    cap: "33030",
    citta: "Udine"
  };
  eta: 50,
  telefono: "0432123456"
};

Si noti come dentro l’oggetto vi sia stato inserito un sotto insieme relativo a Residenza. L’esempio soprastante è piuttosto una scocciatura, nel senso che rispetto a quanto imparato fino ad ora tocca ricordarsi della punteggiatura corretta. In questo caso JavaScript ci consente di essere molto più flessibili e la stessa cosa, ovviamente più prolissa, può essere scritta in:

var Anagrafica ={};

Anagrafica.nome = "Mario";
Anagrafica.cognome = "Rossi";
Anagrafica.residenza = {
  indirizzo: "Via Nazionale",
  civico: 30,
  cap: "33030",
  citta: "Udine"
};

Anagrafica.eta = 50;
Anagrafica.telefono = "0432123456";

Personalmente trovo il secondo metodo decisamente migliore perché ad uno sguardo rapido si può identificare l’oggetto e la proprietà senza finire con il prendere fischi per fiaschi. Ma ci consente di creare nuove proprietà alla bisogna in modo “slegato” rispetto a Proprietà 1, ovvero potremo integrare l’oggetto in seguito senza doversi ricordare di dichiarare tutto e subito.

Come detto sopra, queste proprietà sono relative all’oggetto e solo esso può interagire. Tuttavia possiamo estrapolare queste informazioni. Ad esempio dichiarando una nuova variabile.

var nome = Anagrafica.nome;
//oppure
var nome = Anagrafica["nome"];

La scelta tra i due sistemi è derivata dalla vostra eventuale esperienza pregressa con altri linguaggi di programmazione. Francamente mi pare che il primo metodo sia quello più coerente. Quindi abbiamo visto come sia possibile andare ad estrapolare i vari dati all’interno dell’oggetto,

Torniamo sui Metodi, utilizzando gli ultimi esempi riguardanti le proprietà. In particolare il secondo sistema. Ad esempio vogliamo creare una funzione che ci mostri il nome e il cognome.

Anagrafica.nomeCognome() {  return this.nome + " " + this.cognome; }

La parola chiave [textmarker color=”CFCFCF”]this[/textmarker] ovvero questo in italiano, che ci permette di richiamare l’ultimo oggetto a cui appartiene il metodo invocato. Si tratta di una parola chiave riservata molto utilizzata nei metodi

Conclusioni

Gli oggetti sono molto utili nelle definizioni di sottoinsiemi riutilizzabili o per definire dei raggruppamenti per migliorei nei contenuti di una specifica pagina HTML come vedremo nei futuri articoli.