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插件调用中的参数无关紧要。那是为了测试目的。

我有两个问题：

  1. 在翻译后的 JavaScript 中，预期的代码已自动包装在(function(){}).call(this). 我以前从未见过。它有什么作用？安全吗？更重要的是，它在某种程度上是一种编码标准吗（因为 CoffeeScript 正在这样做）。这里要补充一点：我是 CoffeeScript 的新手，所以它可能是括号放错或其他什么的副产品。尽管如此，它似乎并没有阻碍操作。
  2. 执行代码时，我得到<div id="specialDiv"> </div>. 在代码中，您可以看到我console.log()以调用者（应该是一个 jQuery 对象）作为参数进行调用。它在哪里解开？

非常感谢您的宝贵时间。

4

1 回答 1

1

  1. CoffeeScript 会自动执行此操作，以确保每个非显式全局变量都被限定为包装函数范围内的局部变量。一个显式的全局变量仍然可以使用，window.myGlobal = 3或者在 CoffeeScript 的顶层使用@myGlobal = 3. 这也是编写 JavaScript 的好方法。因此，当您编写x = 3或window = { }使用 CoffeeScript 时，这些被视为对局部变量的赋值，而不是对全局变量的赋值。

  2. 由于console它不是局部变量——它不在任何封闭词法范围的局部变量表中——JavaScript 的后备是尝试将其作为全局变量有效window.console。

使用 CoffeeScript 时，您不需要遮蔽jQuery、window和您自己。document在 CoffeeScript 中，所有非显式全局变量都是本地的：CoffeeScript 将保护您，就像在 JavaScript 中隐藏这些变量会保护您一样。

于 2013-08-07T16:01:52.267 回答