Nelle scorse puntate abbiamo visto come sfruttare la programmazione ad oggetti in JavaScript, con la possibilità di aggiungere metodi per mezzo del prototyping, che permette di estendere gli oggetti JavaScript in modo semplice e veloce. Oggi vedremo come ottenere lo stesso risultato in modo più tradizionale, usando un paradigma simile a quello classico della programmazione Object Oriented.
Consideriamo ad esempio la classe
function dog(name) {
this.name = name;
this.speak = function() { return (this.name + " barking!" ) }
}
e supponiamo di volerla estendere, creando una sottoclasse (o child class) che estenda quella qui sopra, aggiungendo il metodo changeName. Abbiamo già visto come ottenere questo risultato usando il prototyping in JavaScript
pet = new dog("Scooby-Doo");
alert( pet.speak() );
pet.prototype.changeName = function(name) { this.name = name; }
pet.changeName("Fury");
alert( pet.speak() );
Quando il codice verrà eseguito, il primo alert “farà abbaiare” l'oggetto pet, ottenendo come risultato “Scooby-Doo barking!”. Il comando pet.prototype appenderà il nuovo metodo changeName all'oggetto dog, per cui il secondo alert restituirà come risultato “Fury barking!”.
Il paradigma di programmazione per prototyping è semplice e intuitivo: basta ricordare la sintassi qui sopra per potere aggiungere tutti i metodi che vogliamo, con pochissime righe di codice.
La faccenda si complica se vogliamo ottenere lo stesso risultato usando una sintassi più tradizionale. La difficoltà aumenta per i seguenti motivi
- In JavaScript esistono modi diversi di estendere una classe. Alcuni sono più popolari, altri meno, alcuni sono deprecati o non completamente supportati
- In generale le sottoclassi non ereditano i costruttori della parent class, per cui dobbiamo prestare attenzione alla definizione dei costruttori anche nelle sottoclassi
Consideriamo ad esempio il codice
function puppy() {
this.inheritFrom = dog ;
this.inheritFrom() ;
this.changeName = function(name) { this.name = name; }
}
la classe puppy definita qui sopra estende la classe dog, ad eccezione del costruttore. Il risultato è che eseguendo un comando del tipo
var pet = new puppy ( "Scooby-Doo" ) ;
l'oggetto pet così prodotto non avrà nome, perché la variabile name resterà undefined. Non serve a nulla aggiungere la variabile nella definizione qui sopra, scrivendo ad esempio
function puppy(name) {
etc...
perché l'oggetto puppy non saprebbe come assegnare il valore del parametro name. Una possibile soluzione è quella di ripetere l'assegnazione della proprietà name, ovvero clonare il codice del costruttore dal parent, scrivendo ad esempio
function puppy() {
this.inheritFrom = dog ;
this.inheritFrom() ;
// This must be after the inheritFrom clause
this.name = name ;
this.changeName = function(name) { this.name = name; }
}
in questo modo tutto funziona. Occorre però fare attenzione, e ricordarsi di assegnare la proprietà this.name dopo le linee dove realizziamo l'ereditarietà, altrimenti la proprietà name sarà interpretata come una nuova variabile, senza alcun collegamento con quella del parent.
In conclusione, se abbiamo bisogno solamente di estendere qualche oggetto, e non ci interessa entrare nei dettagli della programmazione ad oggetti in JavaScript, la soluzione offerta dal prototyping sembra più semplice, robusta e veloce. Se invece dobbiamo addentrarci in profondità nel paradigma OOP, probabilmente dovremo rimboccarci le maniche e spendere qualche ora per approfondire la basi della tecnologia JavaScript, prima di mettere le mani sul codice.
