-2

我使用的是 js2coffee，但它似乎没有翻译，因为我得到了一个unexpected identifier.

$.fn.wait = function( ms, callback ) {
    return this.each(function() {
        window.setTimeout((function( self ) {
            return function() {
                callback.call( self );
            }
        }( this )), ms );
    });
};

我的咖啡版：

$.fn.wait = (ms, callback) ->
  @each ->
    window.setTimeout ((self) ->
      ->
        callback.call self
    (this)), ms
4

2 回答 2

3

首先清理你的 JavaScript 版本，这样它就不会过于聪明和难以阅读；内联的自执行函数除了让维护和阅读您的代码的人讨厌您之外，实际上并没有为您做任何事情：

$.fn.wait = function( ms, callback ) {
    return this.each(function() {
        var _this = this;
        window.setTimeout(function() {
            callback.call(_this);
        }, ms);
    });
};

这不那么嘈杂，而且更容易一目了然。在 CoffeeScript 中，这个var _this = this技巧通常被一个粗箭头 ( =>)代替，所以我们只剩下这个：

$.fn.wait = (ms, callback) ->
    @each(->
        fn = () => callback.call(@)
        setTimeout(fn, ms)
    )

是的，括号在 CoffeeScript 中通常是可选的，但optional和disabled是不同的词，所以我倾向于包含括号以使结构更容易看到。你也可以fn用这样可怕的东西跳过变量：

setTimeout(
    => callback.call(@)
, ms)

或这个：

setTimeout (=> callback.call(@)), ms

但是在混合中加入一个额外的变量是，IMO，对眼睛来说更容易。

演示：

于 2012-11-03T21:21:06.120 回答
0

使用粗箭头 ( =>)：

$.fn.wait = (ms, callback) ->
  @each ->
    window.setTimeout( =>
      =>
        callback.call( this );
    , ms)

它编译为：

$.fn.wait = function(ms, callback) {
  return this.each(function() {
    var _this = this;
    return window.setTimeout(function() {
      return function() {
        return callback.call(_this);
      };
    }, ms);
  });
};

粗箭头 => 既可用于定义函数，也可将其绑定到 this 的当前值，就在现场。这在使用基于回调的库（如 Prototype 或 jQuery）时很有帮助，用于创建迭代器函数以传递给每个函数，或者使用事件处理函数与绑定一起使用。用粗箭头创建的函数能够访问定义它们的 this 的属性。

（来源：http ://coffeescript.org/#fat_arrow ）

于 2012-11-03T21:18:11.870 回答