Nelle lezioni precedenti, abbiamo visto come creare oggetti e i metodi degli oggetti. In questa lezione, vediamo cosa sono e come funzionano i costruttori degli oggetti e la proprietà prototype
.
Costruttori degli oggetti
Immagina di dover creare 5 diversi oggetti con le stesse proprietà. Manualmente, sarebbe veramente stancante. Tuttavia, si possono utilizzare dei costruttori che creano degli oggetti con proprietà predefinite.
I costruttori non sono altro che funzioni (che approfondiamo più avanti) che contengono delle proprietà predefinite:
function Macchina() {
this.marca = "Fiat",
this.modello = "Panda"
};
let macchina = new Macchina();
Per convenzione, si utilizza la lettera maiuscola per i costruttori degli oggetti, così da non confonderli con le funzioni standard.
Per creare un oggetto utilizzando il costruttore, si utilizza new
. Nell'esempio, puoi vedere che si utilizza la parola chiave this
, che abbiamo visto nella lezione precedente.
Ovviamente, posso creare due o più oggetti diversi utilizzando lo stesso costruttore:
function Macchina() {
this.marca = "Fiat",
this.modello = "Panda"
};
let macchina1 = new Macchina();
let macchina2 = new Macchina();
let macchina3 = new Macchina();
Costruttori con valori variabili
Nell'esempio di prima, abbiamo visto che il costruttore Macchina
contiene delle proprietà predefinite, ma anche valori predefiniti. Per creare oggetti con valori variabili, si utilizzano i parametri delle funzioni (che vedremo nella lezione sulle funzioni).
function Macchina(valore_marca, valore_modello) {
this.marca = valore_marca,
this.modello = valore_modello
};
let macchina1 = new Macchina("Fiat", "Panda");
let macchina2 = new Macchina("Ferrari", "Roma");
let macchina3 = new Macchina("Alfa Romeo", "Giulia");
Nell'esempio, puoi vedere che ogni chiamata alla funzione, ovvero new Macchina(
...)
, contiene due valori (la marca e il modello). Il loro valore viene trasferito in valore_marca
e valore_modello
. Ad esempio, nel primo caso, valore_marca
corrisponderà a "Fiat".
Nota: puoi approfondire le funzioni e le chiamate alle funzioni nella lezione dedicata (che vedrai più avanti).
Ora possiamo visualizzare i dati inseriti:
function Macchina(valore_marca, valore_modello) {
this.marca = valore_marca,
this.modello = valore_modello
};
let macchina1 = new Macchina("Fiat", "Panda");
let macchina2 = new Macchina("Ferrari", "Roma");
alert(macchina1.marca); // Risultato: "Fiat"
alert(macchina2.marca); // Risultato: "Ferrari"
La proprietà prototype
All'interno di un costruttore, non possiamo aggiungere una nuova proprietà. Ad esempio:
function Macchina(valore_marca, valore_modello) {
this.marca = valore_marca,
this.modello = valore_modello
};
Macchina.anno = valore_anno; // Errore
Invece, lo si può fare utilizzando la proprietà prototype
.
function Macchina(valore_marca, valore_modello) {
this.marca = valore_marca,
this.modello = valore_modello
};
Macchina.prototype.anno = 2001;
let macchina = new Macchina("Fiat", "Panda");
alert(macchina.anno); // Risultato: 2001
La sintassi da utilizzare è costruttore.prototype.
proprietà. Con prototype
si possono inserire soltanto valori fissi, ma non variabili:
function Macchina(valore_marca, valore_modello) {
this.marca = valore_marca,
this.modello = valore_modello
};
Macchina.prototype.anno = valore_anno; // Errore