Prototype - Prototipo di Oggetto in Javascript
Il prototipo è un modello che permette di creare una rete di relazione fra l'oggetto e il modello stesso, andando ad aggiungere caratteristiche. E' un metodo di ereditarietà.
In poche parole il prototipo è un modello, qualcosa che non è ancora definito che aggiunge delle caratteristiche ad un oggetto dandogli delle ereditarietà.
Cos'è l'ereditarietà di un Oggetto?
- Tramite il metodo costruttore posso creare prototype che funga da genitore per futuri oggetti basati su di esso.
- Fin'ora abbiamo dato per scontato che Object.prototype fosse il genitore degli oggetti e prototype creati negli esempi. Sfruttando il concetto di ereditarietà possiamo spingerci oltre, definendo un prototype basato su un altro prototype.
- Questo pattern è una delle peculiarità della programmazione OOP e rende la progettazione molto flessibile. In javascript esistono varie tecniche per farlo, vediamo una delle più diffuse:
Sintassi: Prototype
function Oggetto(valore0, valore1, valore2, valore3) {
this.primo = valore0;
this.secondo = valore1;
this.terzo = valore2;
this.quarto = valore3;
}
// se volessi aggiungere una PROPRIETA a questo oggetto, dovrei usare prototype
Oggetto.prototype.quinto = "valore4";
// se volessi aggiungere un METODO a questa proprieta, dovrei usare prototype
Oggetto.prototype.sesto = function() {
const y = 10;
const resto = y - this.quarto;
return resto;
};
const x = new Oggetto("Tanya","DiMeo",3,6,12);
console.log(x.primo + " " + x.secondo + " ha " + x.sesto() + " di resto");
//output: "Tanya DiMeo ha 4 di resto"
Esempio di Prototipo di oggetto (prototype) in Javascript
Mario acquista una villetta che costa 325560€ versa subito 135000€ e il resto viene diviso in 96 Rate, quanto dovrà pagare Mario?.
testo di esempio .testo di esempio .testo di esempio .testo di esempio .testo di esempio .
testo di esempio .testo di esempio .testo di esempio .testo di esempio .testo di esempio .
Codice della lezione: Funzioni in Javascript
// Prototipo di oggetto con METODO COSTRUTTORE
// Costruzione di un oggetto come “stampo” per crearne altri, cioè definire un “tipo di oggetto”
function utente(nome,cognome,via,citta,provincia,cap,addtocart1,addtocart2) {
this.nome = nome;
this.cognome = cognome;
this.via = via;
this.citta = citta;
this.provincia = provincia;
this.cap = cap;
this.shippingcost = 10;
this.addtocart1 = addtocart1;
this.addtocart2 = addtocart2;
this.totale = addtocart1 + addtocart2;
this.iva = function() {
const ivacalc = (this.totale - (this.totale / 1.22));
return ivacalc.toFixed(2) + ' €';
};
};
/* A volte è necessario aggiungere (o rimuovere) dinamicamente METODI o PROPRIETA' dinamicamente ad un PROTOTYPE.
In questo esempio andiamo ad aggiungere dinamicamente una PROPRIETA ad un PROTOTYPE'
- cioè il nome dell'azienda per cui lavorano le ISTANZE z_user
*/
utente.prototype.azienda = " Shroneiken ";
/* In quest'altro esempio andiamo ad aggiungere un METODO al tipo di oggetti.
*/
utente.prototype.sconto = function() {
const importoSconto = 10;
const Prezzoscontato = ((this.totale / 100) * importoSconto);
return Prezzoscontato
};
/* utente è il tipo di Oggetto
z_user1 z_user2 z_user3 sono ISTANZE dell'oggetto utente e vengono creati con la keyword new.
se decidiamo di chiamare il METODO acquisto() lo faremo per un Instanza alla volta (Essi sono isolati l'uno dall'altro)
con la keyword this. ALL'INTERNO DELL'OGGETTO andiamo a DEFINIRE l'oggetto stesso.
con la keyword this. ALL'INTERNO DEL METODO andiamo a far RIFERIMENTO all'oggetto stesso.
*/
const z_user1 = new utente('Elisa','Parioli','via roma 1','Benevento','BN','80001',120,100,);
const z_user2 = new utente('Michela','Senese','via roma 2','Salerno','SA','80002',200,100);
const z_user3 = new utente('Anna','Ramiro','via roma 3','Avellino','AV','80003',300,100);
// Accesso alle proprietà dell'oggetto con sintassi objectName.propertyName
document.getElementById('txtID1').innerHTML = z_user1.nome + ' ' + z_user1.cognome + ' ha speso ' + z_user1.totale + ' €, di cui ' + z_user1.iva() + ' di IVA nell\' azienda ' + z_user1.azienda + " . Se avesse usufruito dello sconto, avrebbe risparmiato " + z_user1.sconto() + " €";
document.getElementById('txtID2').innerHTML = z_user2.nome + ' ' + z_user2.cognome + ' ha speso ' + z_user2.totale + ' €, di cui ' + z_user2.iva() + ' di IVA nell\' azienda ' + z_user2.azienda + " . Se avesse usufruito dello sconto, avrebbe risparmiato " + z_user2.sconto() + " €";
document.getElementById('txtID3').innerHTML = z_user3.nome + ' ' + z_user3.cognome + ' ha speso ' + z_user3.totale + ' €, di cui ' + z_user3.iva() + ' di IVA nell\' azienda ' + z_user3.azienda + " . Se avesse usufruito dello sconto, avrebbe risparmiato " + z_user3.sconto() + " €";
