🚶🏽 ⚠️ 👨🏾‍💼 シリーズ2.プロトタイプ継承の変更における先祖のメソッドの実装方法 🚻 👲🏼 🗂️

habrahabr.ru/blogs/javascript/130495で開始されたものをConstrコンストラクターの便利な.inherit4メソッドに描画して、クラスと継承のモデルを実際に構築します（従来のものよりも強力になりますが、これは副作用です）。 Mootoolsを同様のモデルに接続したくない場合、この2 KBの非圧縮コードのメソッドは、プロトタイプの継承で適切に動作し、いくつかの追加メソッドを持っています：祖先メソッド.ancestor（ 'method_name'、ancestor_generation number ）およびハッシュ拡張へのアクセス 3つすべてのメソッドを使用すると、単語「 prototype」と「 constructor」をレキシコンから除外し、引き続き両方で作業でき、コードが読みやすくなります。

パート1では、2つの機能について、使用可能なアイデアの実装を作成しましたが、将来のコードの品質を改善したいと思います。改善のためのウィッシュリスト：

1）継承ツリーを記述するときのコードの記述と読みやすさを改善します-特に、クラスとして機能するオブジェクトのメソッドを介して継承を記述します（現在は関数です）。

2）コンストラクターの実行を使用してthis.some_method = ...を有効にします。（現在は実行されず、プロトタイプのみが機能するため、メソッドの従来の作成は使用できません）。

3）コンストラクターのプロトタイプを拡張するパラメーターを追加します。各継承の後、定期的に新しいメソッドで子孫のプロトタイプを拡張します。定期的に操作を行う必要があります。前の記事では、 extend（）関数が提供されています。

4）継承コンストラクターに.ancestorを埋め込みます（現在は関数もあります）。

実際、Mootoolsの観点からClassオブジェクトを取得しますが、祖先にアクセスし、定期的なアクションを実行して子孫のプロトタイプをロードします。一般に、継承コードは改善されており、これはメソッドを構築する目的の1つです。

全員、特にララキ、 AndrewSuminのおかげで、最初の部分で祖先へのアクセスについて豊富な批判がなされました。その一般的な方向は、1）OOPの基本原則に従って、直接の祖先を除き、祖先へのアクセスは必要ありません。そうでなければ、これはモデルの設計が不十分であり、モデルを変更する必要があることを示します。また、2） （constructor_name_name）.prototype._reditor_name.apply（this、parameters）を使用して簡単にアクセスできますが、OOPコメントも無視しないでください。

回答：

1.まったく正しい、遠い祖先へのアクセスは誤った設計を示します（Liski原理）。ただし、2つ以上のクラス（コンストラクター）が接続されているJS継承のプロクラスンベッドに多重継承ノードを挿入する場合を除きます。そして、最も近い親へのアクセスについて、原則はそれが有効であると言います（他の使用方法）。この関数は、2番目のデフォルトパラメータ（1）-.ancestor（ 'method'）を使用して、最も短縮された形式にします。

2.はい、4つの単語「 class.prototype.method.apply 」からアクセスできます。1つではなく3つの追加単語のみが追加されます。クラス名と2つの補助単語、「祖先」と相対ノード番号で十分です。一方、継承構造を再構築する場合、冗長表現は変更されず、ノード番号が変更される可能性があります。

したがって、批判は計画されたパスをオフにすることを強制しません。.ancestorメソッドを導入する目的は正当化されました。プレゼンテーションを完了し、 .ancestorを含むかなり完全な継承メソッドを提示する必要があります。それにもかかわらず、批判は重要です-メソッドを実行するための不必要なパラメーター呼び出しを回避する必要があることを思い出させます。理想的には、直接の祖先のみを参照する必要があります（このため、デフォルトでは.ancestorの 2番目のパラメーターで）、または一般的に祖先を参照しないでください。

関数をFunctionのメソッドにする

基本クラスのプロトタイプを介してinherit（） （継承）メソッドを記述できます。基本クラスFunctionをオーバーロードする必要があり、このメソッドはすべての関数にあります。これは悪いことです-すべての関数が詰まり、他のソフトウェアとの競合の原因が発生しますが、継承を記録するための非常にコンパクトな形式が作成されます（これは継承のためのコンストラクター言語の欠如を示します）。したがって、構造を説明し、理解を深めるために、このコンパクトなコードでの継承の例を示します。

例へのリンク（Firebugを使用して作業とメソッドを表示すると便利です）。

実際、これは機能のテストと記事の例への他のリンクを含むテストケースです。分析とその構築は低くなりますが、もはやFunctionに基づいていないため、さらに何かが明確でない場合、または単に美観上の理由から、このコードの検討に目を向ける必要があります。さらに、このコードと例は、後続のより完璧なものとまったく同じように機能します。

基本Functionオブジェクトをオーバーロードしないソリューション

Functionでのメソッドの出現を避けるために、クラスConstr （コンストラクター）を作成します-Mootoolsのクラスコンストラクターの類似物です。すぐに追加の動きが必要になります-関数にそれがないため、 （コンストラクタ）.inheritを書くことはできません。コンストラクターのプロトタイプ（これは長い）を使用するか、 Constrオブジェクトをコンストラクターと見なす必要がありますが、実際には、コンストラクターはこのオブジェクト内の関数になるか、コンストラクター関数がinherit（）定義で読み込まれるたびになります。

後者は、多少費用がかかりますが（各コンストラクターへのリンクをコピーする）、コンストラクターの概念とより整合性があります-関数のままです。したがって、このアプローチについて説明します： inherit（）の定義をロード（追加）するたびに。

写真の継承

ここでは、多機能コードを理解するのが難しいことは明らかです。そのため、継承の1つのステップがどのように機能するかを示す図（ .inherit4（）メソッドを使用）が示されています。基本的に、彼は新しいコンストラクターを新しい操作にし、新しいコンストラクターに1）プロトタイプ（ prototype ）、2） inherit4（）関数、およびプロトタイプに少なくとも4つのプロパティがあることを確認します：祖先（関数）、拡張（関数）、 コンストラクター （関数-自分自身への参照）、 _ anc （関数-コンストラクター親への参照）および3）それら-コンストラクターとそのプロトタイプのすべてのプロパティ、およびプロトタイプのプロパティはより優先され、アクションは不要です。プロトタイプの最初の2つのプロパティ（ 祖先、拡張 ）も自動的にコピーされ、アクションを必要としません-コードにコピーはありません。

結論：継承関数の作成

/** *        . spmbt, 2011 * @param {Constructor} Inherited - - ( extProto,   ) * @param {Object} extProto -     * @param contextArg0 - 1-     */ var Constr = function(){}; Constr.inherit4 = function(Inherited, extProto, contextArg0){ var f2 ={extend: function(obj, extObj){ //    if(obj ==null) obj = this; if(arguments.length >2) for(var a =1, aL = arguments.length; a < aL; a++) arguments.callee(obj, arguments[a]) else{ if(arguments.length ==1){ extObj = obj; obj = this; } for(var i in extObj) obj[i] = extObj[i]; } return obj; }, ancestor: function(name, level, constr){ //    level = level || (level ==0 ? 0 : 1); var t =this; return level <= 1 ? (level ? constr && constr.prototype[name] || t.constructor.prototype[name] : t[name]) : arguments.callee.call(this, name, level -1 , constr && (constr.prototype._anc != Function && constr.prototype._anc || constr.prototype.constructor) || t._anc ); }}; if(!this.prototype || !this.prototype.ancestor){ if(!this.prototype) this.prototype ={}; for(var i in f2) //       this.prototype[i] = f2[i]; } if(this === Constr && Inherited != Constr){ //   if(Inherited ===null) Inherited = Constr; return arguments.callee.call(Inherited, Inherited, extProto, contextArg0); }else{ if(Inherited || (Inherited && typeof Inherited !='function' && !extProto)){ //   ,   extend + ancestor     if(!extProto){ //  1 -       - extProto = typeof Inherited !='function' ? Inherited :{}; Inherited = typeof Inherited !='function' ? function(){} : Inherited; } Inherited.prototype = new this(contextArg0); Inherited.inherit4 = arguments.callee; f2.extend(Inherited.prototype, {_anc: this, constructor: Inherited}, extProto); return Inherited; }else{ if(this === window) return Constr; else{ this.prototype.constructor = this; return this; //  ,   - } } } }; //: A = Constr.inherit4(function(){this.prop ='A';}, {protoProp:'protoA'}); B = A.inherit4(function(){this.prop ='B';}, {protoProp:'protoB'}); C = B.inherit4(function(arg){this.prop ='C';this.propArg = arg ||'XX';}, {protoProp:'protoC'}); D = C.inherit4(function(arg){this.propArgD = arg ||'XX';}, {protoProp:'protoD'}, '3thArgInCInh'); var c01 = new D('ArgInD'); //B.prototype._anc = B; Alert(c01['protoProp'], c01.ancestor('protoProp', 0), c01.ancestor('prop', 0), c01.prop) //'protoD protoD DD' Alert(c01.constructor.prototype.protoProp, c01.ancestor('protoProp'), c01.ancestor('prop', 1)) //'protoD protoD C' Alert(c01.ancestor('protoProp', 2), c01.ancestor('prop', 2) ); //'protoC B' Alert(c01.ancestor('protoProp', 3), c01.ancestor('prop', 3) ); //'protoB A' Alert(c01.ancestor('protoProp', 4), c01.ancestor('prop', 4) ,'-- prop    ,    '); //'protoA C' Alert(c01.ancestor('protoProp', 5), c01.ancestor('prop', 5) ,'-- protoProp    '); //'protoA C' Alert(c01.ancestor('protoProp', 6), c01.ancestor('prop', 6) ); //'protoA C' Alert(c01.ancestor('protoProp2', 4), c01 instanceof A, c01 instanceof D, '--   - undedfined; instanceof - '); //'undefined D true true' Alert(c01.propArg, '--     C; ', c01.propArgD, '--    D');

（以下で説明するいくつかの追加テストを含む実際の例については、コンソールを参照してください（出力はconsole.log（））にあります。）

使用条件（文書ではなく）

ルートクラスの作成：

 _ = Constr.inherit4(function(){_;}, __, 1___); //  ,    //  ,     - {}   _

クラスの継承：

 _ = _.inherit4(function(){_;}, ___, 1___);

インスタンスの作成-通常どおり、 instance = new class（） ;

継承インジケータ-通常どおり、 インスタンス|| class instanceof ancestor class ;

//多重継承の場合、継承ツリーを並べないとinstanceofは機能しません

祖先メソッドリファレンス：

 .ancestor('', _); //   =1

クラス名による先祖メソッドの呼び出しの可能性（コードに実装されていない、リンク＃）：

 .ancestor(, '', [__]);

オーバーロードされた操作：

-----------------------

自身に1つのハッシュを追加します。

 __Constr.extend(xe);

自分に複数のハッシュを追加する：

 .extend(null, xe, xe, ...);

ハッシュの拡張：

 _  = __Constr.extend(xe, xe, ...); //

批判と回答の疑い

テストの分析はもう少し先になりますが、ここでは既にそれを理解している人への答えを示します。

1）ここでは、前の関数の新しいF（）の代わりにクラスコンストラクターが実行されます。アプリケーションコンストラクターが空でF（）と変わらない場合、環境はもう少しロードされます。しかし、プロパティを構築する機会があります。プロパティがコンストラクターに表示されると、環境はさらにロードされますか？いいえ、そうでなければプロトタイプで宣言され、その準備はコンストラクターではなく、近くのどこかで実行され、非構造化コードを脅かすからです。したがって、必要な継承コンストラクターのプロパティを作成し、コンストラクターのデザイナーに依存するプロパティを作成することをお勧めします。

2）継承の方法は、いくつかの追加機能といくつかのチェックによって複雑になっていますか？これはプロトタイプであるため、宣言はルートコンストラクター内で1回重み付けされますが、使用されない場合は実行されません。使用する場合は、どこかで定義する必要があります。

もちろん、チェックは作業を若干遅くしますが、多くの設備があります。それらが必要かどうかは開発者次第です。私の意見では、開発を促進するものは、少なくとも開発段階で正当化されます。

3）祖先にcontextArg0引数が1つだけあるのはなぜですか？オブジェクトの構造をInherited.prototype = new（this.apply（this、contextArgs））の形式で書き込もうとするためです。 -動作しません。しかし、1つの引数ですべてのパラメーターを含むハッシュを設定するのに十分です-引数のほぼ同じでより便利な説明。

4） （this === window）...の場合 、なぜ追加のエンティティが必要ですか？オーバーロードされたハッシュ拡張メソッドの場合（空の1番目の引数または1つの引数を使用）。継承が使用されない場合。

コンストラクター引数を使用する

コンストラクターの引数は、継承者または生成されたオブジェクトを具体化するための非常に重要で有用なメカニズムであり、コンストラクターのプロパティを決定できるため、完全な円に含まれて動的になります。しかし、実装では、配列に多くの引数を渡し、 新しいthis（）関数でapplyを使用してそれらを分散させることはできませんでした-これはjavascriptに実装されていません。しかし、コンストラクタ引数は非常に重要なので、 inherti4の 3番目の引数の代わりに少なくとも1つを導入します。（最初の方法の方が良いでしょうが、メソッドが過負荷になると記録がより複雑になります。）

使用のデモは例にあります。クラスCでは 、最初の引数を取る関数を定義しました-C.inherit4（）の 3番目の引数の代わりに、その最初の引数を記述します。クラスDでは、同様の関数が定義されています-インスタンスの生成では、引数が最初に使用されます。

もちろん、議論が場所から場所へとジャンプするのは不便です。しかし、コンストラクタの引数がほとんどの場合欠落していることを考えると、オーバーロードを異なる方法で行う方法は？現在の最初の引数は常に関数であるという事実を使用できますが、コンストラクターの引数でさえ関数にすることができます。したがって、今のところすべてをそのままにしておきますが、メカニズムを実際に使用することで、より良いものを思いつくかもしれません。主なことは、このメカニズムが現在、機能していることです。

コンストラクター引数は、このプロパティにハッシュを自動的に拡散するように関数に要求します。

 function(arg){ //   if( typeof arg =='object') //    for(var i in arg) this[i] = arg[i]; }

この拡散を自動化する方法は？毎回何かの呼び出しをコンストラクター関数に挿入することはあまり面白くありません。単に相続人を建設する代わりに、

 Inherited.prototype = new this(contextArg0);

拡張：

 if(typeof contextArg0 =='object'){ Inherited.prototype = contextArg0; f2.extend(Inherited.prototype, new this(contextArg0)); }else Inherited.prototype = new this(contextArg0);

ご覧のとおり、これは機能しますが、オブジェクト構築の明白でない機能を導入し、別のチェックを追加します。最終コードには導入しませんが、便利な形式を導き出すために適用する必要があります。

割り当て順序を入れ替えると、

  Inherited.prototype = new this(contextArg0); f2.extend(Inherited.prototype, contextArg0);

コンストラクタープロパティを割り当てるという非典型的な優先順位（プロトタイプよりも高い優先順位）が得られます。これはいつか役に立つかもしれません（ただし、これは習慣に関するさらに危険な実験なので、ここでも説明します）。

テストの分析とアクションのメカニズム

テストのタイプを最初の記事の例と比較できます。ほぼ同じこと（およびコンストラクターの実行）が行われますが、コードはそれほどゆるくないので、引数が適切に配置されました。これは、新しいチェックと何らかの目標への動きを伴う関数コードのファウリングの結果です。

この例では、コンストラクターのプロパティが参加し始めました-「 this.xxx 」から発生するプロパティ。テスト例では、文字A、B、C、Dをそれぞれ独自のレベルに慎重に配置しました。結果には、文字のオフセットが表示されます。 .ancestorはプロトタイプ（ c01.ancestor（ 'prop'、0）を除く）を取得し、プロトタイプは継承者から生成されるため、これは論理的です：祖先プロパティがプロトタイプに書き込まれます。次にわかるのは、プロパティが前のクラスのものであり、プロトタイプが現在のものであるということです。例のc01インスタンスのみにプロトタイプがありません（それらは作成しませんでした）。したがって、前のクラスから取得されます。したがって、最初の行「protoD D」は表示された文字と同一であり、以下にオフセットがあります。

プロトタイプとコンストラクタのプロパティがまったく同じように動作するためには、 if（this === Constr）...条件をキャッチして最初の祖先と「ループ」継承を見つける必要がありました。物語の最初の部分のように、「親切の爆弾」が機能します。これは、不在の財産を参照するときにエラーを与えません。それにもかかわらず、すべてのプロパティの「早すぎる」祖先にアクセスする場合、同じ動作を達成しました。親の最初の既存のプロパティが返されるか、 未定義です。

参照による例で動作するテストは、多重継承が（劣って）動作する方法、先祖Constrを持つオブジェクトでオーバーロードされたメソッドが動作する方法を示しています。これについて-少し低い。

継承モデルとそのバリエーション

デザイナーとプロトタイプの両方のプロパティを使用する場合、これはやや奇妙な継承モデルです。モデルは古典的な継承よりも強力であり、よく見ると、このアルゴリズムのフレームワーク（この非常に30行のアルゴリズム）内で、古典的な継承の類似物を2つ以上の方法で実装できます。または、次の順序で「ステップ周波数を2倍にした」継承：

基本クラスはコンストラクターAのプロトタイプです（そのプロパティはプロトタイプに格納されます）。
1番目の相続人-コンストラクタAのプロパティ（2番目の相続人のプロトタイプに格納されています）;
2番目の相続人-コンストラクターBのプロトタイプ（プロパティ-ここでは、2番目の相続人のプロトタイプ）;
3番目の相続人-コンストラクターBのプロパティ（4番目の相続人のプロトタイプに格納）;
...

もちろん、これは純粋な古典的な継承ではありません。コンストラクタのプロトタイプを変更できるため、すべての相続人のプロパティを即座に変更できるためです。ただし、先祖のプロパティは各クラスに保存されません（スクリプトエンジンに最適化がない限り）。継承者を作成した後にプロトタイプを変更する「間違い」を回避すると、「ステップの頻度が2倍」のモードでも古典的な継承が得られます。

多重継承

互換性の理由から、 instanceof操作では多重継承はサポートされていないと言わなければなりません。彼女を先祖の木に反応させることは、祖先の列に木を構築することによってのみ可能です。同時に、inherit4（）の特別なフェイントにより、プロトタイプのプロパティが既に存在している場合、祖先からのブランチのマージが通常行われます。混合のコードは例に含まれていないため、継承は機能しません。プロトタイプは最後の祖先からのみ値を受け取ります。

 1 = Constr.inherit4(function(){this.prop ='prop1'; this.propA ='propA';}, {protoProp:'prot1'}); 2 = Constr.inherit4(function(){this.prop ='prop2';});  = 1.inherit4({protoProp:'prot11', protoPropA:'protA'});  = 2.inherit4(, {protoProp:'prot2'});

正しい結果は、継承のチェーン「 祖先1-祖先2-継承者」のマージツリーのアライメントです。1を超える世代の祖先のメソッドにアクセスする方法が便利な場合です。

二重継承速度はどこに適用できますか？

継承の構造が決定され、レベルごとに何を書くかがわかります。たとえば、プログラムのデフォルト設定（基本クラス）を使用するタスクがあります。これは「推奨設定」によってブロックされ、「優先推奨」によってブロックされ、最終的にユーザー設定によってブロックされます。合計-どこでも4レベルの設定-継承関係。明らかに、JSでは、2つのコンストラクターと記述された型の継承によって実装できます。

この例では、クラスプロシージャも同じになります。より複雑な場合、継承の「ハーフステップ」ごとに独自のプロシージャを作成することは非常に可能です。

これはすべて美徳ではなく、単に使用できない追加機能であり、操作.inherit4（）の継承の1ステップを記述します。そしてもちろん、この使用のためにはJSの継承モデルを理解する必要があります。古典的な継承だけでは十分ではないことを知っているだけです。

プロパティの拡張-「パブリック」での拡張の説明、および他の多くの説明を引き出す

副次的なタスクを解決するために必要ではないが、それらのコードが記述され使用されるプロパティ。これは、ハッシュを拡張するためのextendメソッドであり、引数をオーバーロードするための関連する機能です-さまざまなモードで、さまざまな目的で使用します。（これらのプロパティは、上記の関数および例で既に実装されています。）なぜですか？はい。少なくとも、より多くの型チェックが行われるjQueryよりも高速なハッシュマージが必要です。

1）実際、 Constrが定義されているすべての場所に実装されて準備が整っているので、（ extend関数の数行の）良いものが消えるのはなぜですか？（継承されたすべてのオブジェクトに拡張が挿入されるという事実は気に入らないかもしれませんが、それを無効にしても問題はありません。）

2） ...そして、散歩に行くために-散歩に行くために、1つの引数が記述されている場合、または最初の引数がnullの場合、自分自身を拡張する可能性を拡張します。

3）追加の利便性-このクラス（コンストラクター）を継承しない場合、プロトタイプに拡張機能と祖先関数の両方を含めるために、引数なしで（コンストラクター）.inherit4（）を記述できます。 （オブジェクト）.ancestor（ 'methodname'）は、生成されたオブジェクト（ object = new constructor（）; ）に直接マッシングメソッドが割り当てられた場合にも意味があります-コンストラクターのプロトタイプメソッド（コンストラクター自体ではない）が（人間が読み取れる）アクセス権を持つobject.constructor.prototype [name] ）。

例（これは同じ単語よりも明確です）：

Function.prototype.inherit3の同様の例も方法を知っていますが、異なる方法で記述されていることに注意してください。

  = Constr.inherit4(null, {a: 333}); //   = new (); //   - .a = 555; //  Alert(.a, .ancestor('a'), "--     "); //    : 333      : Alert(.extend({a:3}, {b:4}, {c:5}), "--      " ); //Object {a=3, b=4, c=5}

4）最初の引数を返していることを考えると、名前のない相続人を作成して、後で名前を付けることができます（より正確には、名前が付けられます:)）。

 //     (  - null) obj = new (Constr.inherit4()); Alert( obj.extend(null, {a:1}, {b:2}) ); //Object { a=1, b=2, _anc=function(), ...

5）例では、記事の最初の部分でオブジェクトの明示的なプロトタイプを作成する必要があることをすでに忘れていました。これは2番目のパラメーターによって行われます。これは明確で便利です。

 A = Constr.inherit4(function(){_ }, {_});

この形式では：

 A = Function.inherit4(function(){this.prop ='A';}, {protoProp:'protoA'});

コードは、散在するプロパティ定義を使用するよりもはるかに良く見えます。

その結果、コードは「肉」に成長していることがわかりますが、各セクションは非常に効率的に機能します。

基本クラスObjectに.extendメソッドが割り当てられていないことを忘れないでください。したがって、これは{x：2} .extend（{a：1}）;です。 -動作しません（基本クラスの拡張による棄権の費用）。でも

 Alert( (new (Constr.inherit4(function(){this.x = 2;}) ) ).extend({a:1});

-will（オブジェクト{a：1、x：2、およびいくつかの関数}を与えます）。（悪夢-もちろん、誰もこれを行いませんが、アイデアは実証され（それ自体を拡張します）、よりストレッチされたコードの場合に動作します。）主なことは、何も失わないことです（名前空間のみが詰まっています）、拡張機能はすでにそこにありました、それ先祖のように、プロトタイプのルートオブジェクトConstrに割り当てられました。

PS誰かが少なくとも継承または同様のアプローチに非常に類似したアプローチの説明へのリンクを提供する場合、私たちはすべて非常に感謝します-このアプローチがどこに導くかを知ることは興味深いです。

PS2優しさの爆弾をどのように取り除く必要がありますか？

シリーズ2.プロトタイプ継承の変更における先祖のメソッドの実装方法