【JavaScript】原型継承の原理

1608 ワード

二つのルール:
  • .__proto__ === .prototype
  • . === ? . : .[__proto__]n .
  • ルール2の解釈について:インスタンスの属性を検索する場合、まず自分がこの属性があるかどうかを判断します.そうでなければ、__proto__にはこの属性がありますか?もしあるならば、それです.そうでなければ、__proto__.__proto__にこの属性がありますか?ずっと見つからないなら、undefinedです.(ここには必ずうさんくさいところがあります.
    テストの用例:(テスト環境、Chrome 44、Win 7)
    1.構造関数と実例を考察する
    var F=function(){};    //    F
    F.prototype={};    //        prototype
    var f=new F;    //     
    console.assert(f.__proto__===F.prototype);    //    1
    
    console.assert(f.a===undefined);    //         
    
    F.prototype.a=1;    // prototype      
    console.assert(f.a===f.__proto__.a);    //    2
    console.assert(f.a===F.prototype.a);    //    1
    console.assert(f.a===1);    //      
    
    まとめ:
    f.a===f.__proto__.a
    ===F.prototype.a===1
    
    2.考察相続
    var G=function(){};    //        
    G.prototype=f;    //        prototype       
    var g=new G;    //      
    console.assert(g.__proto__===G.prototype);    //    1
    
    console.assert(g.__proto__===f);    //       
    console.assert(g.a===g.__proto__.a);    //    2
    console.assert(g.a===f.a);    //       
    console.assert(g.a===1);    //      
    
    まとめ:
    g.a===g.__proto__.a===g.__proto__.__proto__.a
    ===G.prototype.__proto__.a===f.__proto__.a===F.prototype.a===1
    
    3.読み取り専用性を調べる
    g.a=2;    //            
    console.assert(g.a===2);    //    2
    console.assert(f.a===1);    //            
    
    結論:原型継承は、本質的にはインスタンス属性の検索ルールを利用しています.
    参考文献:『ECMAScript』® 2015 Language Specification——第3ページ4.2.1