CoffeeScriptでjQueryプラグインを書くためのテンプレート


やあみんなjQueryは使っているかな?いろんなJSのフレームワークに押され気味がけど
まだまだ現役なんだよ

jQueryもプラグインをかけると、いろいろこねくり回して実装していたところがすっきりかけるのだ。

いつでもさくっと書けるようにCoffeeScriptのテンプレートを作成した。
JavaScriptで書く場合もコンパイル済みテンプレートを使えばばっちりだ

CofeeScriptで書いたjQueryのプラグインのテンプレート

do (jQuery) ->
  $ = jQuery
  $.fn.sampleMethod = (config) ->
    # デフォルト引数の設定
    defaultConfig =
      url: 'www.yahoo.co.jp'

    # 呼び出し時に連想配列で渡された引数とデフォルト引数を重ねあわせする
    # {}
    options = $.extend(defaultConfig, config);

    @each () ->
      # セレクタでヒットした各項目に対して行う処理
      # 主にこの下に処理を書いていく
      $(@).find(".foo")

JavaScriptにコンパイルした結果

(function(jQuery) {
  var $;
  $ = jQuery;
  return $.fn.sampleMethod = function(config) {
    var defaultConfig, options;
    defaultConfig = {
      url: 'www.yahoo.co.jp'
    };
    options = $.extend(defaultConfig, config);
    return this.each(function() {
      return $(this).find(".foo");
    });
  };
})(jQuery);

使い方

$('.sampleClass').sampleMethod({url: 'www.google.co.jp'})