logo Dove iniziare Linguaggi Aiuto Blog
Home Dove iniziare Linguaggi Aiuto e Supporto Info e Blog

Costruttori e prototype degli oggetti

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

Prova!Completa gli spazi vuoti con il testo appropriato.
// Crea un oggetto con il costruttore
function Libro(pagine) {
  this.pagine = pagine
};
let libro1 = (134);

Prova!Scegli l'opzione corretta tra quelle elencate.
// Aggiungi al costruttore la proprietà "editore"
function Libro(pagine) {
  this.pagine = pagine;
};
__________________ = "Mondadori";