L’hoisting delle classi in JavaScript

L’hoisting per classi non consente di accedere ad una classe prima delle sua dichiarazione a causa della temporal dead zone

Le class, introdotte da ECMAScript 6, cercano di simulare le “classi” di altri linguaggi consentendo di utilizzare super per accedere alle classi padre, definire metodi statici e estendere altre classi. Ecco un esempio di classe:

    class MyClass {
        constructor(name) {
            this.name = name;
        }
        print() {
            console.log(this.name);
        }
    }

    var myClass = new MyClass("Datrevo");
    myClass.print(); // => Datrevo

L’hoisting per le class si comporta in maniera simile a let. Non è possibile accedere alle classi prima delle loro fase di inizializzazione (temporal dead zone):

    var myClass = new MyClass("Datrevo"); // ReferenceError: MyClass is not defined

    class MyClass {
        constructor(name) {
            this.name = name;
        }
        print() {
            console.log(this.name);
        }
    }

Anche per le class, JavaScript obbliga a seguire la best practies di definire una classe prima di utilizzarla.

Come per le funzioni, anche le classi posso essere create tramite un’espressione (con l’uso di var). Anche in questo caso l’hoisting si applica alla variabile, di conseguenza cercare di accedere al valore della classe prima della sua dichiarazione genera un undefined.

    console.log(myClass); // => undefined
    var MyClass = class {
        constructor(name) {
            this.name = name;
        }
        print() {
            console.log(this.name);
        }
    }
    var myClass = new MyClass("Datrevo");

Per maggiori informazioni sul ciclo di vita delle classi: Il ciclo di vita di let, const e class in JavaScript.

Indice:

Pubblicato in Front-end, JavaScript Taggato con: , , ,

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

*