Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save TakashiSasaki/11173428 to your computer and use it in GitHub Desktop.
Save TakashiSasaki/11173428 to your computer and use it in GitHub Desktop.
JavaScriptでどうやってクラスっぽいものの継承っぽいもことをやるの?

C++/Java/Pythonでクラスは使ってるしPythonではメタクラスも使うけど、JavaScriptのプロトタイプベースの継承ってのがよく分からん。prototypeプロパティ、prototype.constructorプロパティ、__proto__プロパティ、Object.createメソッド、new演算子なんかの挙動がこんがらがって。アレコレ実験して確かめたつもりになっても、あれ?これってプロパティが設定されているわけじゃなくてプロトタイプチェーンたどって呼び出されてるだけだった、なんてことが多くて。アホやな俺。

#1 JavaScriptにおける継承 とりあえず以下のようにやる。

        var F = function(x){
            this.x = x;
        };
        
        F.prototype.setX = function(x){
            this.x = x;
        };
        
        F.prototype.getX = function(){
            return this.x;
        };
        
        var f = new F(100);
        
        var G = function(x){
            F.call(this, x);
        };
        
        G.prototype = Object.create(F.prototype);
        G.prototype.constructor = G;
        
        var g = new G(100);

__proto__は非標準なので使わない。Object.createでプロトタイプを複製してprototypeプロパティに入れる。そのままだとnew G()で生成されるインスタンスのコンストラクタがFになってしまうので、G.prototype.constructor = Gする。


ここから下は、下書き。無視して。

#1 _proto_

__proto__は隠されたプロパティで、プロトタイプチェーンはこのプロパティをたどって行われる。JavaScriptの実行エンジンによっては__proto__プロパティが無いかもしれないが、とにかくすべてのオブジェクトには何らかの隠されたプロパティがあって、プロパティチェインのために使われる。名前がないと不便なので、__proto__プロパティがあろうがなかろうがそう呼ぶ。任意のオブジェクトo__proto__プロパティを持っていて、oのプロパティpを探すとき、pが見つからなければo.__proto__.pを探す。無ければo.__proto__.__proto__.pを探すのだろう。で、jsdo.itで遊んでみたら、__proto__はdeprecatedだから使うなって怒られた。http://jsdo.it/TakashiSasaki/wrD0 代わりにObject.getPrototypeOfを使えってことらしい。

@TakashiSasaki
Copy link
Author

おお、拡張子を.mdにしたら自動的にMarkdownのマークアップを理解してそれっぽい表示にしてくれるのか。こりゃいいや。

@TakashiSasaki
Copy link
Author

書きかけ。とりあえずjsdo.itでの実験はできた。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment