jQueryを読み解く1（〜38行目）

jquery javascript

いろいろ整理中に、あとで読もうと思っていた以下の記事を久しぶりに目にしました。（7年ぶりくらい）
jquery.jsを読み解く：特集｜gihyo.jp … 技術評論社

jQueryはオワコンだとかよく聞きますが、単純なWebではまだまだ使われるでしょうし
（脱jQueryするにはもう少し時間が掛かるかと思います）
jQueryのソースはほどんど読んだことがなかったので、ちょろっと読んでみることにしてみます。

Introduction

第1回　jQueryライブラリ（1～171行目）：jquery.jsを読み解く｜gihyo.jp … 技術評論社
こちらの記事は、v1.2.2 で当時は、93KB 程度のようでしたが 今の最新はv2.1.4で248KB に膨れており行数的にも約3倍ほどになっています。

読んでみます（〜35行目）

(function( global, factory ) {

    if ( typeof module === "object" && typeof module.exports === "object" ) {
        module.exports = global.document ?
            factory( global, true ) :
            function( w ) {
                if ( !w.document ) {
                    throw new Error( "jQuery requires a window with a document" );
                }
                return factory( w );
            };
    } else {
        factory( global );
    }
}(typeof window !== "undefined" ? window : this, function( window, noGlobal ) {

なんと、CommonJS対応していたんですね。全然知りませんでした。

yak shaving

node触りたくなったので、コードリーディング開始2分で終了してyak shavingです。

nodeでjQueryを使う

いろいろうまくいかなくて、最終的には以下のようにすると実行できました。
（node周りは更新が早く、すぐ情報が陳腐化してしまいますね。）

npm init
npm install jquery --save-dev
npm install node-jsdom --save-dev

var jsdom = require("node-jsdom")
var html = '<html><body><h1>h1_text</h1></body></html>';
var window = jsdom.jsdom(html).parentWindow;
var $ = require('jquery')(window)

var h1 = $('h1').text();
console.log(h1);

package.json抜粋。

  "devDependencies": {
    "jquery": "^2.1.4",
    "node-jsdom": "^3.1.5"
  },

ちょっと解説

冒頭のjQueryのソースにあるように、windowオブジェクトがないとjQueryは利用できないため
node-jsdom でwindowを作成します。
jsdom というものがあったようですが、現在は io.js のみの対応となり
node-jsdomという別npmを利用するようにしています。
また、node-jsdomにはjQueryify という機能もありこれを利用することでjQueryの機能も使えるようです。
（jQueryを直接requireするのとはまた別のやり方）

jQueryプラグインの今後（は、どうなるんでしょうか）

jQueryプラグインのCommonJSモジュール化からnpmに公開するまでの方法 | mae's blog
こちらが詳しいのですが、
なんと The JQuery Plugin Registry に npm に登録する注意書きが記載されています。
これは、browserify 皆使おうぜってことなんでしょうか？
周りでbrowserify 使ってる人みたことないんですが。。。どうしよう。

参考

・jquery.jsを読み解く：特集｜gihyo.jp … 技術評論社
・node-jsdom
・jQueryプラグインのCommonJSモジュール化からnpmに公開するまでの方法 | mae's blog