Inheritance è un concetto centrale nella programmazione orientata agli oggetti che ti consente di estendere classi esistenti e di utilizzare le loro proprietà e metodi. JavaScript ha introdotto una sintassi di eredità più recente e robusta con l'introduzione di ES6, che è molto più facile da gestire rispetto ai metodi Prototype originali. In questa guida ti mostrerò come applicare l'ereditarietà in JavaScript utilizzando la parola chiave extends e ti spiegherò passo dopo passo come chiamare correttamente il costruttore della classe base con super.

Risultati principali

  • L'ereditarietà in JavaScript avviene tramite la parola chiave extends.
  • Il costruttore della classe base deve essere chiamato con super.
  • Le variabili di istanza possono essere referenziate tramite la parola chiave this nella classe derivata.

Guida passo-passo

Creazione della classe base

Per iniziare con l'ereditarietà, creiamo prima una classe base chiamata Shape. In questa classe definiamo il costruttore e alcuni metodi.

Qui definisci una classe Shape che ha un costruttore. Puoi definire variabili e funzioni in questo costruttore a cui possono accedere altre classi.

Ereditarietà in JavaScript: Con ES6 verso classi moderne

Esplorazione della sottoclasse

Dopo aver creato la classe base, puoi ora creare una sottoclasse che eredita da Shape. In questo esempio chiamiamo la nuova classe ConcreteShape.

In questa sottoclasse utilizziamo la parola chiave extends per specificare che ConcreteShape eredita da Shape. Il costruttore della sottoclasse chiama il costruttore della classe base Shape con super(), il che è necessario per implementare correttamente l'ereditarietà.

Inizializzazione della sottoclasse

Ora che abbiamo creato la sottoclasse, è tempo di generare un'istanza di questa classe.

Qui crei un nuovo oggetto myShape della classe ConcreteShape e passi una descrizione al costruttore. Poi chiami il metodo print, che restituisce la descrizione.

Aggiunta di ulteriori proprietà

Puoi aggiungere ulteriori proprietà alla tua sottoclasse o persino metodi che sono specifici per questa sottoclasse.

Qui hai esteso la classe ConcreteShape aggiungendo parametri aggiuntivi al costruttore.

Utilizzo dell'ereditarietà

Con la parola chiave super puoi chiamare il metodo describe della classe base per combinare le proprietà della classe base e della sottoclasse.

Riepilogo – Eredità in JavaScript: Da ES6 a ES13

In questo tutorial hai imparato come funziona l'ereditarietà in JavaScript, in particolare con la nuova sintassi class. Hai visto come definire classi, come ereditare da una classe base e come chiamare correttamente il costruttore. Questi meccanismi rendono più facile mantenere il tuo codice pulito e manutentabile, riutilizzando le funzionalità in modo efficiente.

Domande frequenti

Qual è la differenza tra super() e this?super() viene utilizzato per chiamare il costruttore della classe base, mentre this fa riferimento all'istanza della classe corrente.

Perché l'uso delle classi Es6 è migliore dei prototipi?Le classi ES6 offrono una sintassi più chiara e intuitiva che facilita la lettura e la comprensione del codice.

Posso avere più classi base?No, JavaScript non supporta l'ereditarietà multipla. Una classe può ereditare solo da un'altra classe.

Cosa succede se non chiamo super()?Se non chiami super(), riceverai un errore poiché il costruttore della classe base, che inizializza ciò che è necessario per la classe, non verrà eseguito.