jQuery()の挙動を解読する(24) jQuery 1.2.2 における jQuery 定義コードを分析する──jQuery解読(36)

ver1.2.2 における jQueryインスタンス生成コード

1.2.2 ではまたしても jQuery オブジェクトの定義コードが変わりました。1.2 から 1.2.1 でも変わっていましたので、根幹部分の定義が立て続けに更新されている訳です。

1.2.2の変更によって（18行のコメントにもあるように）新たに jQuery オブジェクト（その実体は関数）は そのプロパティである init() メソッドをコンストラクタとするインスタンスを受け取るものとして位置づけられました。

 17: var jQuery = window.jQuery = function( selector, context ) {
 18: 　// The jQuery object is actually just the init constructor 'enhanced'
 19: 　return new jQuery.prototype.init( selector, context ) :
 20: };

ここで興味深いことは、ver1.2.1までと異なって、jQuery 関数オブジュクトそれ自体がコンストラクタなのではない、ということです。コンストラクタは jQuery のプロトタイプオブジェクトの init メソッドになっています。

さて、最初はこの変更されたコードの意味及び変更の意義が分かりませんでした。そこで改めて new 演算子やコンストラクタについて学び直さなければなりませんでした。分かっていたつもりなのに、結局半可通だったことを再認識させられたのです。

通常の説明におけるコンストラクタ、インスタンス、new 演算子（復習）

通常コンストラクタ、インスタンスの学習コード等では、例えば次のような例示が行われます。

　var Rectangle = function (x,y){ this.x=x; this.y=y; }
　Rectangle.prototype.area= function(){ return this.x * this.y };
　Rectangle.prototype.outer = function (){ return 2*(this.x + this.y) };
　var inst = new Rectangle(2,3);
　inst.area(); 　// result = 6
　inst.outer();　// result = 10

この例では、Rectangle コンストラクタ関数から生成されたインスタンスオブジェクト(inst)は、そのコンストラクタオブジェクト (Rectangle) に関連づけられたプロトタイプオブジェクト　(Rectangle.prototype) からプロパティを継承する、と説明されます。

つまり、プロトタイプオブジェクトのプロパティである area() メソッドや outer() メソッドが inst オブジェクトに継承されるので、上記例の最後の２行のような結果が取得出来る、という説明です。

次に、Javascript第５版によれば「 new 演算子は、(1)空のオブジェクトを生成し、(2)コンストラクタ関数の prototypeプロパティをそのオブジェクトの prototype として設定し、(3)そのオブジェクトへの参照をキーワード this に代入し、(4)そのオブジェクトのメソッドとしてコンストラクタ関数を呼び出す」と説明されています。

上記の Rectangle に沿って言えば、(1)空オブジェクト（仮に obj とする）を生成し、(2)obj.prototypeを設定し （この prototype 値は Rectangle.prototype に同じなので obj.area()、obj.outer() が設定され）、(3)this = objとし、最後に (4) Rectangle.apply(this, [x,y]) を実行する、となります。

注目すべきことは、コンストラクタ関数の実行は最後に行われるのであって、その前にプロトタイププロパティがオブジェクトに設定されることです。もう一度順番を書けば
　　(1) obj 生成、(2) obj.prototype = Rectangle.prototype 設定
　　(3) this = obj 設定、(4) Rectangle.apply(this, [x,y]) 実行
となります。

jQuery 定義コードにおけるコンストラクタ、インスタンス、new 演算子

次に同じ事を jQuery 定義コードに適用してみます。19行の new 演算子とそれに続く init 関数は
　(1) obj生成、(2)obj.prototype = jQuery.prototype.init.prototype 設定
　(3) this = obj設定、(4)jQuery.prototype.init.apply(this, [selector, context]) 実行
を行うことになります。

しかし、ここに登場する jQuery.prototype.init.prototype には何もプロパティやメソッドを定義していません。

一体、initメソッドのプロトタイププロパティはどんな内容なのでしょうか？　それはどこで定義されているのでしょうか？───こんな疑問が湧いてきます。

そしてその答えを探したところ、それは 1.2.2 で新設された次の２行にありました。

525 // Give the init function the jQuery prototype for later instantiation
526 jQuery.prototype.init.prototype = jQuery.prototype;

つまり、jQuery.prototype.init 関数オブジェクトのプロトタイプは jQuery 関数オブジェクトのプロトタイプに等しくなります。

これを踏まえてjQuery定義コードの19行目を整理すると、
　(1) obj(=this)作成
　(2) this.prototype = jQuery.prototype.init.prototype = jQuery.prototype設定
　(3) jQuery.prototype.init.apply(this, [selector, context])実行
となります。

こうして、jQuery 関数オブジェクトはコンストラクタ init 関数から return される実行結果 （ それは this であったり、様々な指定によって生成された[obj]であったり、[selector]であったりする ） を受け取ると共に、jQuery.prototype プロパティに定義された様々なメソッドやプロパティを継承することになります。

init は従来通り初期化関数として作動し、かつ jQuery.prototype に設定される様々なメソッドやプロパティは jQuery 関数オブジェクトに継承されるわけです。

それにしても何故、jQuery.prototypeオブジェクトのメソッドである init() をコンストラクタとするのか？

1.2.1までの方法を敢えて変更した理由はどこにあるのでしょうか？「インスタンスを生成してから init() メソッドを起動し、その return を jQuery オブジェクトが受け取る」という従来の方法を変えた理由が分かりません。極めて合理的なコードだと思っていたのですが、1.2.2 のコードの方が何らかのメリットがなければそうしないでしょうから、是非とも変えた理由を探りたいのですが、力及ばず、残念ながら解明出来ていません。

そこで改めて コード「 jQuery.prototype.init.prototype = jQuery.prototype 」を考えてみる

この式は「循環参照」問題を引き起こすのではないか、と言うことに気がつきました。

右辺の prototype オブジェクト内には、当然 init プロパティがあり、その init プロパティは prototype プロパティがあります。つまり jQuery.prototype.init.prototype が右辺の prototype オブジェクト内に存在しています。

以下その繰り返しになります。

その結果無限にこれが繰り返され、メモリが消費されるのではないかと考えられます。

実際、或るサイトでそのことを確認したところ下図のように際限なくinit.prototype 内にinit.prototype が内包されていることが確認できました。

どこまで行っても際限なく繰り返される init.prototype 循環にコードとして問題はないのだろうか？