Class JavaScript, utilizzare le classi ES6 JavaScript

Class JavaScript – In questa lezione impareremo ad utilizzare le classi in JavaScript introdotte nella versione ES6 (ECMAScript 2015) per la prima volta.

È 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.

Un costruttore può usare anche la parola chiave super che serve a richiamare il costruttore della classe padre.

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.

Banner Pubblicitario

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.

Banner pubblicitario

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);

Lezione precedente: object assign

Lezione successiva: esercizi sugli oggetti in JavaScript