Warum werden ES6-Klassen nicht gehisst?

Question

Da ES6 Klassen sind nur syntaktische Zucker über JavaScript bestehenden Prototyp-basierte Vererbung[1] es würde (IMO) Sinn Winde machen es Definition:

var foo = new Foo(1, 2); //this works 

function Foo(x, y) { 
    this.x = x; 
    this.y = y; 
} 

Aber das Folgende nicht:

var foo = new Foo(1, 2); //ReferenceError 

class Foo { 
    constructor(x, y) { 
     this.x = x; 
     this.y = y; 
    } 
} 

Warum werden ES6-Klassen nicht gehisst?

Answer 1

Warum werden ES6-Klassen nicht gehisst?

Eigentlich sie sind gehisst (die variable Bindung in den gesamten Umfang verfügbar ist) wie let and const are - sie sind nur nicht initialisiert.

Es wäre sinnvoll, die Definition hissen

Nein. Es ist nie eine gute Idee, eine Klasse vor seiner Definition zu verwenden. Betrachten Sie das Beispiel

var foo = new Bar(); // this appears to work 
console.log(foo.x) // but doesn't 

function Bar(x) { 
    this.x = x || Bar.defaultX; 
} 
Bar.defaultX = 0; 

und vergleichen Sie es mit

var foo = new Bar(); // ReferenceError 
console.log(foo.x); 

class Bar { 
    constructor (x = Bar.defaultX) { 
     this.x = x; 
    } 
} 
Bar.defaultX = 0; 

, die einen Fehler wirft, wie man erwarten würde. Dies ist ein Problem für statische Eigenschaften, Prototyp Mixins, Dekoratoren und alles. Außerdem ist es sehr wichtig für Unterklassen, die komplett in ES5 brach, wenn Sie eine Klasse mit seinem nicht angepassten Prototyp verwendet haben, aber nun einen Fehler ausgibt, wenn eine extend Ed-Klasse noch nicht initialisiert ist.

Answer 2

In Javascript alle Erklärungen (var lassen, const, Funktion, Funktion *, Klasse) sind gehoben, aber es sollte in gleichen Umfang deklariert werden.

Wie Sie „ES6 Klassen sind nur syntaktischer Zucker über JavaScript bestehenden Prototyp-basierte Vererbung“, sagte

So Lassen Sie uns verstehen, was es ist?

Hier haben Sie eine Klasse deklariert, die in der Tat "spezielle Funktion" ist. Nehmen wir an, dass Ihre Funktion Foo() und Klasse Foo beide im globalen Geltungsbereich sind.

class Foo { 
    constructor(x, y) { 
     this.x = x; 
     this.y = y; 
    } 
} 

Folgendes ist der kompilierte Code Ihrer Klasse Foo.

var Foo = (function() { 
    function Foo(x, y) { 
     this.x = x; 
     this.y = y; 
    } 
    return Foo; 
}()); 

Intern Klasse umgewandelt wird mit dem gleichen Namen in Wrapper-Funktion (IIFE) und die Wrapper-Funktion gibt Ihre Funktion zu funktionieren.

Da der (Klassen-) Bereich Ihrer Funktion geändert wird. und Sie versuchen, ein Objekt der Funktion in einem globalen Umfang zu erstellen, der in Wirklichkeit nicht existiert.

Sie erhalten die Funktion in der Variablen Foo sobald Compilation dazu kommt. Damit Sie später in var arbeiten können, können Sie ein Objekt erstellen.