JavaScript/Costruttori e prototipi
In questo capitolo vedremo come creare nuovi oggetti e prototipi e come modificare gli oggetti esistenti in JavaScript. Questa è una delle varie possibilità dei linguaggi che implementano i tipi di dato direttamente come oggetti, consentendo di poter agire sul "cuore" del linguaggio stesso.
Creare oggetti personalizzati
[modifica | modifica sorgente]Come abbiamo spiegato nel capitolo sugli oggetti di JavaScript, per definire un nuovo prototipo di un oggetto è sufficiente definirne un costruttore, che non è altro che una funzione.
Ad esempio, volendo creare un oggetto "Macchina", sarà sufficiente creare una funzione Macchina()
e instanziarla poi in una variabile:
function Macchina() {
//...
}
var macchina = new Macchina(); //notare in questo caso la distinzione tra maiuscolo e minuscolo
Per fare riferimento alle proprietà dell'oggetto, all'interno della funzione usiamo la parola chiave this
:
function Macchina(mod) { //passiamo qualche parametro al costruttore...
this.modello = mod;
}
var macchina = new Macchina("Fiat Panda");
//posso modificare e accedere alle proprietà
macchina.modello = "Fiat 500";
alert(macchina.modello);
Per creare un metodo inseriamo invece una funzione all'interno del costruttore:
function Macchina(mod) { //passiamo qualche parametro al costruttore...
this.modello = mod;
this.carburante = 0;
function rifornisci(euro) {
var litri = euro/prezzo_benzina;
this.carburante += litri;
}
}
La creazione di oggetti personalizzati è in realtà piuttosto inutile nei casi presentati dagli esempi, ma può risultare comoda per applicazioni più complesse: l'uso degli oggetti permette un'organizzazione dei dati chiara ed efficiente.
Modificare gli oggetti predefiniti
[modifica | modifica sorgente]Molto interessante è anche la possibilità di accedere al prototipo di un oggetto, permettendo così di modificare anche tutte le sue istanze.
Ad esempio, il seguente spezzone di codice aggiunge a tutti gli array un metodo che prende un valore e restituisce true
se è presente nell'array. Per fare questo accediamo al suo prototipo:
Array.prototype.contains = function (element) {
for(i in this) { //scorre tutti gli elementi
//se trova l'elemento restituisce true ed esce dalla funzione
if (this[i] == element) return true;
}
return false; //questa riga verrà eseguita solo se non viene trovato nulla
}
var arr = new Array('a', 'b', 'c', 'd', 'e', 'f');
if (arr.contains('g')) { //falso
//...
}
if (arr.contains('a')) { //vero
//...
}
I costruttori in es6 e successivi
[modifica | modifica sorgente]Es6 mette a disposizione un nuovo sistema per creare oggetti: attraverso le classi. Le classi non sono altro che costruttori, ma queste semplificano notevolmente la leggibilità del codice e la creazione di metodi. Ecco un semplice esempio, in cui definiamo l'oggetto auto:
class auto {
constructor (modello, marca, targa) {
this.modello = modello;
this.marca = marca;
this.targa = targa}
stampaModello() { //questo è un metodo
console.log (this.modello); }
}