07 | 2017/08 |  09

  1. 無料サーバー

User forum-FC2BLOG-Info-Edit Template-Post-Edit-Upload-LogOut

CSSやJavascript自習の苦闘史を綴っていきたい。恐縮ですがJavascriptを有効にしてご覧ください。
2005年12月から社会問題も掲載!

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

 

jQueryインクルード時の挙動を追跡する ──jQuery解読(4) on ver1.21

  • 初稿:2007/10/29
  • 改訂:2007/11/23……誤謬(returnの意味を誤解していた)修正

多忙故に投稿に間が空いてしまいましたが、jQuery解読によるJavascript学習を先に進めたいと思います。

まず、jQuery1.2.1.jsがインクルードされた時にどの様に振る舞うのか、解明したいと思います。

既に変数jQueryが定義されている場合の対応

13:// Map over jQuery in case of overwrite
14:if ( typeof jQuery != "undefined" )
15: var _jQuery = jQuery;

ここでは、既にjQueryが定義済みの場合に、そのjQueryを変数_jQueryに代入し、既存のjQueryをいわば待避しています。このコードにより既存のjQueryがこの後のコードによって上書きされても、無名関数の呼び出しが終わる迄の間は、既に存在していたjQueryを_jQueryに保存することが出来ます。

なお、このような待避の必要性、つまりjQueryのscriptコードが読み込まれた時点で、既に変数jQueryが存在しているケースはどの様な場合があるのか判然としません。

しかも、この変数 _jQuery は Call オブジェクトの変数であって、決してグローバル変数ではありませんから、インクルードが終われば消滅してしまいます。つまり待避させた_jQuery を利用しようとすれば jQuery.js 内にそれを利用するコードを加えなければなりません。

jQueryインスタンス生成のためのコード

その方法は1.2と1.2.1で全く異なっていますが、jQuery 関数が呼び出された時の this が jQuery のインスタンスでない場合にはそれを作成し、this がインスタンスであった場合には init() 関数を呼び出しています。但し、この jQuery インスタンスは jQuery インクルードに生成されるわけではありません。インクルード時には jQuery の定義文が解釈されるだけです。jQuery のインスタンスが生成されるのは、ユーザーによってjQuery(・・・)関数が呼び出された時です。

インクルード時には関数は解釈されるだけなので、ここでの主題からははずれますが、ここで、そのjQuery()呼び出し時の、1.2.1におけるインスタンスの作成方法のあらましを解読しておきます。

17:var jQuery = window.jQuery = function(selector, context) {
18:  // If the context is a namespace object, return a new object
19:  return this instanceof jQuery ?
20:      this.init(selector, context) :
21:      new jQuery(selector, context);
22:};

※ ここで使われている instanceof は、Javascript1.4以降で使用可能となった演算子で、「a instanceof A」の構文で、aがAのインスタンスであるかどうかを判定しています。

jQuery1.2迄は、this が window か、this.init が存在してない場合に、jQueryのインスタンスを生成し、そうでない場合には this.init() を呼び出してましたが、1.2.1による instanceof 演算子を使用する方法の方がスマートです。

このコードは次のことを行っています。

なお、このコードにおける「 return 値の連鎖 」の分析については、 Javascript基礎の基礎(1) return 値は「何に」返されるのか?──jQuery解読(16)をご覧ください。

  1. まず無名関数の実行によって作成されるCallオブジェクトのプロパティとしてvar jQueryを定義しています。(line17)
  2. 次に、window.jQuery を定義します(line:17)。つまりGlobal変数としてjQueryを定義します。そしてそれをCallオブジェクトのjQueryに代入しています(line:17)。
  3. 次にこれらの変数に無名関数 function(selector, context) を代入します(line:17)。これは馴染みの表現で言えば、function jQuery (selector, context) を定義したことになります。
  4. そしてその無名関数では2つのケース毎に異なる機能を実行します。
  5. まず、this が jQuery のインスタンスだった場合には init() メソッドを呼び出し実行します(line:20)。いわゆる初期化を行う訳です。
  6. また、もし this が jQuery のインスタンスでなければ、それを生成します(line:21)。インスタンスオブジェクトは空オブジェクトとして生成された後に、直ぐにjQuery(a,c)関数をコンストラクタ関数として呼び出すので、引き続いて init() メソッドが呼び出されます。

関数リテラルで表現されたこのコードは、インスタンス作成と作成されたインスタンスの初期化を一気に行っており、非常に合理的だと思います。

既にグローバル変数 $ が存在する場合の対応

24:// Map over the $ in case of overwrite
25:if ( typeof $ != "undefined" )
26:  var _$ = $;

$はprototype.jsなどでも使用されているGlobal変数ですから、jQuery.jsのインクルード時に既にそれが存在している可能性があります。そこでこのコードが必要となります。また当然jQuery()インスタンスの生成によっても定義されますから、直前のインスタンス生成による $ を待避することにもなります。

ここで重要なのは前者です。jQueryによる $ が他のフレームワーク等によって定義されたグローバル変数 $ を上書きしても支障がないように、_$ に既存の $ を待避させています。

但し、この変数 _$ は _jQuery同様にCall オブジェクトの変数であって、決してグローバル変数ではありませんから、インクルードが終われば消滅してしまいます。つまり待避させた_$を利用しようとすればjQuery.js内にそれを利用するコードを加えなければなりません。

 

■ コメントの投稿 ■

管理者にだけ表示を許可する

●トラックバック●

■トラックバックURLはこちら■
http://hkom.blog1.fc2.com/tb.php/573-5767bda2

●参照元一覧●

<provided Fc2>
<provided i2i>

▲ToTop

 90%近いシェアを握っているインターネットエクスプローラの描画エンジンを利用したタブbrowser。沢山のタブbrowserがあるが、多機能、カスタマイズフリー、スクリプト利用等で一日の長がある。Gekkoエンジンへの対応も行われ、IEからの自立独立の方向に向かっている。2005年7月にはIE7が登場する見通しの中で、今後の発展が望まれる。

 多様なCSS作成支援機能を備えた、タグ入力式 HTML&CSS作成支援エディタ。スキンデザインもすっきりしている。テキストエディター上で作成するよりも確実で安全にタグ打ちが出来る。
文字コードを選べないのが欠点。

 StyleNote同様のタグ入力式 HTML&CSS 作成支援エディタ。長年使用してきたが現在StyleNoteに乗り換えつつある。

 クリップボード履歴情報を活用する為のソフト。画像まで履歴を取ってくれるのが嬉しい。このソフトを使わない日は絶対ない程に重宝し、愛用している。

 起動中のウィンドウの「コピーできない」説明文などの文字列を取得し、コピー可能な文字データにするツール。何かと便利。

 ストリーミングデータを保存することが出来るソフト。動画利用には不可欠なソフトだ。

 無料ながらレイヤー機能を有し、スクリプトによる拡張も可能な、sleipnir作者が提供している優れもの画像編集ソフト。

 画面キャプチャソフトと言えばこれに勝るものなし、ではないだろうか? 様々な取得方法を有しており、ブログ作成にもHomepage作成に不可欠だ。Jtrimと並んでWoodyBellsの作品。

 複数ファイルの同時編集は出来ないが、透過pngも作れる画像編集ソフト。
(以下当該サイトから抜粋)初心者にも簡単に操作が出来るフォトレタッチソフトです。多くの加工機能で画像に様々な効果を与えることができます。非常に軽快に動作するため、ストレスなく操作できます。

 Animation Gifファイルを作れる無料ソフト。

 キャプチャソフト。画面内にサイト全体が表示しきれない場合でも、これを使えば全体をキャプチャすることが出来る。

 画像処理。画像のフォーマット変換のみならず、色数やサイズ、圧縮率の変更まで一括処理できてしまう『BatchGOO!』は、大量の画像をまとめて処理したいときに大変便利なソフト。BMP, TIFF, JPEG, PCX, PNG の相互変換をはじめ、色数・サイズ・解像度の統一、JPEG圧縮率の調節など、ホームページ用の画像や携帯電話用の壁紙を揃えるのに抜群の相性を見せる。(Vectorの当該ソフト紹介頁より抜粋引用)

 名前から直ぐに想像が付くように画像のサイズを測るためのソフトだ。Homepage作成には欠かせない。2カラム、3カラムのレイアウトを行う場合に大変重宝する。

 ランチャーソフトは沢山あるが、中でもこれが一押しだ。2年以上使ってきたがその操作性には毎日満足している。これを使い始めてからデスクトップには一切のアイコンを表示することをやめてしまった。

 AdobeReader7によって、起動時間が長すぎるという長年のユーザーの不満はある程度解消した。そのためこの高速化ソフトは存在価値が低下してしまったかもしれない。AdobeReader6迄はこのソフトによる起動高速化で恩恵を受けてきた。

 IE専用が難点だが、様々なサイト内でIDやパスワードを入力するのに重宝するソフト。コンテキストメニューから簡単に起動できるのがGood! sleipnir等のIEの描画エンジンを利用しているブラウザでも使える。

 利用しているパソコンの諸元値を取得するには、このソフトがベストだ。インストール済みソフトの一覧が取得できるのも嬉しい。

 WMPは機能が豊富なだけ重い。RealPlayerも同様だ。そこでMedia Player Classicを使いたい。動作が軽快なだけではなく、対応しているファイル形式もすこぶる多く、これひとつで、wmvもrmも表示できてしまうのだから凄い! 数多あるMedia Playerの王様と言えるだろう。

 自宅でPCを起動しているときには必ず起動しているメディアプレーヤー。何かと過剰なWinampよりも、起動も速くスキンはシンプルだ。

 DivX, Xvid, Mov, Vob, Mpeg, Mpeg4, avi, wmv, dv, などの動画をDVD-Video形式に変換できるフリーソフト。クリックするとDVD関連ソフト紹介サイト=「DVDなToolたち」なるHomepageが開きます。

----------
200710290141
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。