Panda Noir

JavaScript の限界を究めるブログでした。最近は幅広めに書いてます。

ES2015のクラス構文は今までのクラス構文の糖衣構文ではない

もう2018年になったのに今更ES2015の話かよという感じですね・・・ES2018といえばAsync Iterator楽しみですね。

仕様書を読んだわけではありませんので厳密なことは言えません。ご容赦ください。

今までの構文との共通点

  • prototypeにメソッドがぶら下がる
  • newで呼び出すことでインスタンスを生成できる

いままで

function Person(name) {
    this.name = name;
}
Person.prototype.greeting = function(you) {
    console.log("Hello, " + you + "! I'm " + this.name);
};
const person = new Person("Taro");

ES2015

class Person {
    constructor(name) {
        this.name = name;
    }
    greeting(you) {
        console.log(`Hello, ${you}! I'm ${this.name}`);
    }
}
const person = new Person("Taro");

相違点

ほぼほぼ同じなのですが、関数として呼び出そうとしたときにエラーが起きるかどうかが異なります。

function Person(name) {
    this.name = name;
}
Person("Taro"); // Personはただの関数なので問題なし
class Person {
    constructor(name) {
        this.name = name;
    }
}
Person("Taro"); // Personはクラスであり関数でないのでエラーが起きる

このように、newなしで呼び出そうとした時にエラーを吐くかどうかが異なっています。newつけ忘れを防止できるので非常にありがたい仕様です。