💡

JavaScriptのオブジェクト指向(っぽいこと)

2021/10/13に公開

はじめに

JavaScriptはプロトタイプベースのオブジェクト指向言語です。classは(昔ながらの)JavaScriptにはありません。そのためJavaScript以外の言語をやってた人がJavaScriptのコードを見るとすこしとっつきにくいところがあります。

JavaScriptでclassっぽいことをやる書き方を2つ書きます。

昔ながらの方法

functionとして実装する方法です。

thisというこれまたJavaScriptでは難解なワードが出てきますが、ここでのthisはPythonで言うselfみたいなものです。

function classic_style_class(name = "classic") {
    // この部分がコンストラクタに相当する
    this.name = name;
    console.log("classic style class");

    // メソッド
    this.hello = msg => {
        console.log("Hello " + msg + ",this is " + this.name);
    }
}

これをインスタンス化するときはnew演算子を使います。newすることでthisがインスタンスそのものに束縛されます。(thisについてはまた別にまとめようと思います)。またメソッドでない地の文に書かれたコードはすべて実行されます。

myobj = new classic_style_class();

class構文

ECMAScript6からclass構文が使えるようになりました。

class new_style_class {
    constructor(name = "new") {
        this.name = name;
        console.log("new style class");
    }

    hello(msg) {
        console.log("Hello " + msg + ",this is " + this.name);
    }
}

呼び出し方は昔ながらの方法と同じです。基本的な機能も変わりませんが、下記のような細かい違いがあります。

  • classでは巻き上げが起こらない。functionを使う方法ではfunction宣言より前でインスタンス化できるが、classではできない。
  • class内のスクリプトはStrictモードで実行される。

参考

MDNのドキュメント

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Classes

Discussion