ECMAScript aggiungerà le classi a JavaScript? Cosa significa questo?

Question

ECMAScript aggiungerà le classi a JavaScript? Cosa significa questo?

#1 da (14 voti)

5

Ho sentito che una specie di sistema di classe verrà aggiunto a JavaScript con ECMAScript e trovo un po 'confuso, perché ho appena finito di leggere un libro JS, JavaScript, The Good Parts di Douglas Crockford, dove ha spiegato che la mancanza di classi non era affatto negativa, era solo diversa. Credo di aver visto che spiegava che qualsiasi somiglianza con un linguaggio basato sulla classe era solo per diminuire la confusione durante quell'era o qualcosa del genere, per aiutare JS a cogliere.

Da quanto ho capito, JavaScript non dovrebbe avere classi, semplicemente non fanno parte del design di JS. ES6 cambia fondamentalmente la funzionalità JS o è solo sintassi zucchero?

javascript language-design ecmascript

posta Viziionary 05.12.2015 - 17:34

fonte

1 risposta

Leggi altre domande sui tag javascript language-design ecmascript

Valore consigliato da passare al posto del parametro String per un metodo in java Un DB NoSQL sarebbe più efficiente di un DB relazionale per la memorizzazione di oggetti JSON?

score 14 · Accepted Answer

La sintassi della classe ES6 non modifica affatto la funzionalità di Javascript. È semplicemente lo zucchero di sintassi per le dichiarazioni di prototipi. Una volta analizzato, crea solo oggetti prototipo che possono quindi essere utilizzati in modo OO allo stesso modo in cui gli oggetti prototipo dichiarati manualmente sono sempre stati utilizzati in JS. Quindi, la sintassi della classe non cambia davvero nulla, tranne rendere più carine le definizioni dei prototipi da dichiarare. Gli oggetti risultanti non sono più simili a una classe di quelli che le persone hanno fatto manualmente in ES5.

Ecco un esempio (esegui solo in un browser che supporta la sintassi ES6% diclass come Chrome a partire da dicembre 2015).

// ES6 class syntax
class Polygon {
    constructor(height, width) {
        this.height = height;
        this.width = width;
    }
    calcArea() {
        return this.height * this.width;
    }
    get area() {
        return this.calcArea()
    }
}

// ES5 equivalent prototype syntax
function Poly(height, width) {
    this.height = height;
    this.width = width;
}

Object.defineProperties(Poly.prototype, {
    calcArea: {
        value: function () {
            return this.height * this.width;
        }
    },
    area: {
        get: function () {
            return this.calcArea();
        }
    }
});

var p1 = new Polygon(10, 20);
var p2 = new Poly(10, 20);
log(p1.area);
log(p2.area);
log(Object.getOwnPropertyNames(Object.getPrototypeOf(p1)));
log(Object.getOwnPropertyNames(Object.getPrototypeOf(p2)));

Output in Chrome a partire da dicembre 2015:

200
200
["constructor","calcArea","area"]
["constructor","calcArea","area"]

Working jsFiddle: link