JavaScript
es6
es2015

Prototype 継承と ES2015+ の Class がどう違うのか分からなかったので調べた

最近、 JavaScript Modules 形式で提供されていない Prototype 継承された Class を継承した上で JavaScript Modules として使いたいなぁと思い、
これまで Prototype 継承なんか一切触れてこなかったので色々調べた結果をメモ程度ですがまとめます。

「Prototype 継承って何?」とか「Class の使い方」とかの話は出ません。


難しい話は何もないのですが(むしろ難しい話が class 構文により省かれたのですが)、
ES2015+ の Class は Prototype 継承の糖衣構文だそうなので、特に何も意識せず Class 構文で継承することが出来ました。

以下では createjs の Shape を継承しています。
継承元 Class で元々の関数の挙動が上書きされている場合はいじってあげる必要があったりするのかも。

const Shape = window.createjs.Shape

class MyShape extends Shape {
  toString(){
    return `[object ${this.constructor.name}]`
  }
}

const myShape = new MyShape()
myShape.toString() // => "[object MyShape]"

ES2015+ の Class 式 == Prototype 継承 と理解しておけば良さそう。という雑感です。


調べる際参考にさせて頂いた記事: