(function($) {
    //このPluginの名前
    var name_space = 'basePlugin';
    $.fn[name_space] = function(options) {
        //いったん退避
        var elements = this;

        //設定情報の構築
        var settings = $.extend({
            //optionの初期値を設定
            'param' : 'value'
        }, options);

        //内部用method
        var inner_method = function () {
            //内部の共通処理の記述
        };

        //要素を一個ずつ処理
        elements.each(function() {
            $(this)
                //イベント等の設定
                .keyup(inner_method)
            ;
        });

        //method chain
        return this;
    };
})(jQuery);

注意点としてはこんな感じです。

• window.$に依存しない （$.noConflict()時にも動くように）
• 最後はreturn this; （method chainが切れるので）
• 複数要素が指定されている場合を考慮する （Plugin内のthisは.eachで処理する）
• 名前空間を汚染しない （無名関数に閉じているのでPlugin自体の変数も外部から見えない）

jQuery.event周りのコードではよく以下のような記述が行われています。

var namespaces = type.split(".");
handler.type = namespaces.slice().sort().join(".");

namespacesは.split()の結果なのでArrayであることは保証されていますが、なぜか.sort()を行う前に.slice()を行っています。

これはJSの.sort()が破壊的であるためで、一旦.slice()を行うことにより配列のコピーを作成し、その結果に対して.sort()を実行するための記述です。

もしここで.slice()を行わない場合、.sort()段階でnamespaces自体が.sort()されてしまい、後でnamespacesを使用するときに元の順番を再現することができなくなってしまいます。

また、同じような処理として.slice()の代わりに.concat()を使用する場合もあります。

5 .extend()を使用したobject拡張

jQuery.extend()の基本的な機能はobjectの拡張ですが、単一の引数で呼び出された場合、jQuery object自体の拡張を行います。

jQuery.extend({ 'hoge' : 'huga' });
console.log(jQuery.hoge); // => huga

また、jQuery.fn.extend()も単一の引数で呼び出された場合、jQuery.fn object自体の拡張を行います。

jQuery.fn.extend({ 'hoge' : 'huga' });
console.log(jQuery().hoge); // => huga

ここで、jQuery.fn.extend()の拡張し対してjQuery()でアクセスしていますが、jQuery.fn.extend()への拡張はjQuery objectではなく、jQuery functionの呼び出し結果のobjectへの拡張になります。

jQueryの内部でもjQuery.method形式で呼び出すmethodとjQuery().method形式で呼び出すmethodでは同じ名前でも扱いが違うので注意してください。 （$.eachと$().eachは別物として定義されています）

6 jQuery.event

jQueryではブラウザの仕様から外れたeventの扱いが多く、実装のほとんどをjQueryの内部で行っています。 （namespace、eventのbubbling、eventへの独自引数、イベント設定時の初期化処理、カスタムイベント、live event、ブラウザ差異の補正）

コードを読むときは以下の点を注意して読んで見てください。

1. namespaceは.区切りで複数の名前空間を指定できること（$().bind(‘click.hoge.huga’, function () {})が可能）、
2. 追加されたeventはjQuery.data(elem, “events”)に保存されていること、
3. jQuery.data(elem, “events”)内のイベントの呼び出しをjQuery.data(elem, “handle”)経由で行っていること