0

私は、トピックから外れて役に立たない暴言を含めて、質問を不必要に長くする癖があります. 今度はやらないようにします。より適切でわかりやすいタイトルがなかったことをお詫びします。

というわけで、これがCoffeeScriptコードです。

(($, window, document) ->

  # Conventionally 'private' variables
  _name     = 'aPlugin'
  _defaults =
    property: 'value'

  _debug    = (args) ->
    console.log args
    return

  # Plugin constructor
  Plugin = (element, options) ->
    @element = element
    @options = $.extend true, {}, _defaults, options

    @init()
    return

  # Initialization
  Plugin.prototype.init = () ->
    # Initialization logic here
    _debug(@element) unless typeof(@element)=='undefined'
    return

  # Plugin wrapper, allowing for multiple instances
  # and chainability
  $.fn[_name] = (options) ->
    return @.each (idx) ->
      ($.data @, 'plugin_' + _name
      new Plugin @, options
      ) unless $.data @, 'plugin_' + _name
  return

) jQuery, window, document

JavaScript にコンパイル (またはトランスコンパイル) したときの同じコードを次に示します。

(function() {
  (function($, window, document) {
    var Plugin, _debug, _defaults, _name;
    _name = 'aPlugin';
    _defaults = {
      property: 'value'
    };
    _debug = function(args) {
      console.log(args);
    };
    Plugin = function(element, options) {
      this.element = element;
      this.options = $.extend(true, {}, _defaults, options);
      this.init();
    };
    Plugin.prototype.init = function() {
      if (typeof this.element !== 'undefined') {
        _debug(this.element);
      }
    };
    $.fn[_name] = function(options) {
      return this.each(function(idx) {
        if (!$.data(this, 'plugin_' + _name)) {
          $.data(this, 'plugin_' + _name);
          return new Plugin(this, options);
        }
      });
    };
  })(jQuery, window, document);

}).call(this);

そして、明確にするために、このプラグインを次のように呼び出しています。

jQuery(document).ready(function($) {
    $('#specialDiv').aPlugin({ aString: 'Hello world!', aNumber: 62742, aObject: { aString: 'Hello aPlugin!', aNumber: 6274210 } });
});

optionsプラグイン呼び出しの引数は関係ありません。それはテスト目的のためです。

2 つの質問があります。

  1. 翻訳された JavaScript では、意図したコードが自動的に でラップされています(function(){}).call(this)。私は前にそれを見たことがありません。それは何をするためのものか？安全ですか？さらに、それはコーディング標準のようなものですか (CoffeeScript がそれを行っているため)。ここに追加するもの: 私は CoffeeScript を初めて使用するので、括弧の位置が間違っているか何かの副産物である可能性があります。それでも操作に支障はないようです。
  2. コードが実行されると、<div id="specialDiv"> </div>. console.log()コードでは、caller (jQuery オブジェクトである必要があります) を引数として呼び出していることがわかります。どこで開封されますか？

お時間をいただき、誠にありがとうございました。

4

1 に答える 1

1

  1. CoffeeScript は、すべての非明示的なグローバル変数がラッパー関数のスコープ内のローカル変数としてスコープされるように自動的に行います。明示的なグローバル変数はwindow.myGlobal = 3、CoffeeScript のトップ レベルで@myGlobal = 3. これは、JavaScript を記述する良い方法でもあります。x = 3そのため、CoffeeScript でorを記述するwindow = { }と、これらはグローバル変数ではなくローカル変数への代入として扱われます。

  2. consoleはローカル変数ではないため (囲んでいるレキシカル スコープのローカル変数テーブルにはありません)、JavaScript のフォールバックは、効果的にグローバル変数として試すことですwindow.console。

CoffeeScript を使用する場合、 、 、および自分自身jQueryをwindowシャドウする必要はありません。documentCoffeeScript では、明示的でないグローバル変数はすべてローカルです。CoffeeScript は、JavaScript でこれらの変数をシャドウイングするのと同じ方法でユーザーを保護します。

于 2013-08-07T16:01:52.267 に答える