È dunque possibile utilizzare la parola chiave class in JavaScript, come in altri linguaggi di programmazione, per definire una nuova classe.
Questo modo di creare gli oggetti si aggiunge ai precedenti analizzati nelle lezioni precedenti dove, tra gli altri, abbiamo utilizzato il costruttore di funzioni, il costruttore object ma soprattutto gli oggetti letterali che rappresentano il modo più comune, fin'ora utilizzato, per creare e gestire gli oggetti, grazie alla sua semplicità di utilizzo.
Da zero ad eroe
Entra nel mondo della programmazione web: variabili, funzioni, array, DOM, eventi. Con esercizi pratici e progetti coinvolgenti.
- ⏱️ 8 ore di corso registrato
- 🧩 Più di 50 algoritmi risolti passo passo
- 🎯 Livello base — da zero ad eroe
- 💻 100% online, fruibile quando vuoi
Class JavaScript - esempio per creare un oggetto auto
Creiamo lo stesso oggetto auto d'esempio delle stesse lezioni, al fine di comparare i vari metodi fin qui proposti.
Utilizziamo la parola chiave class, seguita dal nome della classe, nel nostro caso auto.
Utilizziamo poi il costruttore, un metodo speciale usato per creare un oggetto, specificando i parametri tra parentesi tonde.
Ci deve essere un solo metodo con il nome constructor, altrimenti si avrà un'eccezione di tipo SyntaxError.
Ecco dunque un esempio dove creiamo una classe auto, specificando 3 proprietà: marca, modello e anno.
Utilizziamo anche una funzione visualizza che richiameremo come metodo sull'oggetto auto per visualizzare le proprietà dell'oggetto.
class auto {
constructor(marca, modello, anno) {
this.marca = marca;
this.modello = modello;
this.anno = anno;
}
visualizza() {
return this.marca + ' ' + this.modello + ' ' + this.anno;
}
}
const autoMia = new auto('Fiat', '500', 2019);
console.log(autoMia.visualizza());
console.log(autoMia.modello);
Class JavaScript - Extend e super
L'ereditarietà è una caratteristica importante della programmazione ad oggetti.
Con il termine di ereditarietà si intende la possibilità di estendere una classe genitore attraverso una classe figlia che eredita tutte le caratteristiche dalla classe genitore.
Questo metodo serve per evitare ridondanze, ma anche per generare codice funzionale.
La parola chiave extends consente proprio di sfruttare questa caratteristica.
Quindi dopo aver definito una classe persone con il costruttore a cui passiamo come parametri il nome, il cognome e l'età, andiamo a costruire la classe mestieri come estensione di persone.
Questo vuol dire che eredita dalla classe persone le 3 proprietà specificate.
All'interno del costruttore invochiamo super per richiamare le proprietà del genitore ereditate. In definitiva super ci consente di fare riferimento alla superclasse.
Ecco dunque l'esempio completo:
class persone {
constructor(nome, cognome, eta) {
this.nome = nome;
this.cognome = cognome;
this.eta = eta;
}
}
class mestieri extends persone {
constructor(nome, cognome, eta, mestiere) {
super(nome, cognome, eta);
this.mestiere = mestiere;
}
}
var cantante = new mestieri('coding', 'creativo', 32, 'cantante');
console.log(cantante.mestiere);
Alcuni link utili
Indice tutorial JavaScript
Le funzioni di callback
Le function callback usate con i metodi e con gli array
Esempi funzioni di callback
Come utilizzare le callback e setTimeout
Cifrario di Cesare online
Come realizzare un convertitore da decimale a binario, ottale ed esadecimale
Come creare PDF con JavaScript
PDF da un form con JavaScript
