javascript - Rails 3 javascript 细 CoffeeScript 引用错误(类)未定义

Question

RubyRogues 播客上有人曾经说过“学习 CoffeeScript，因为 CoffeeScript 编写的 javascript 比你更好。”抱歉，不记得是谁说的...

所以，我采用了一个非常简单的 WORKING javascript 函数:

togglingii.js

function pdtogglejs(id) {   $('div .partybackground').removeClass("hidden");  }

此行正在调用:

<a href="#" class="dctoggle" onclick="pdtogglejs('partybackground')">Read More...</a>

然后我将其转换为这个 CoffeeScript :toggling.js.coffee

pdtogglecs(id) ->
   jQuery('div .partybackground').removeClass("hidden")

并更改了 html 以引用 pdtoggle*c*s 而不是 pdtoggle*j*s。

我可以在我的 application.js 文件中很好地看到它们:

(function() {

  pdtogglecs(id)(function() {
    return jQuery('div .partybackground').removeClass("hidden");
  });

}).call(this);
function pdtogglejs(id) {   $('div .partybackground').removeClass("hidden");  }
;
(function() {



}).call(this);

但是，只有纯 JavaScript 才有效。 CoffeeScript 始终返回 Uncaught ReferenceError: pdtogglecs is not Defined.

根据其他 stackoverflow 问题，这一定是某种命名空间错误。可能是因为 pdtogglecs 本身在函数内部的方式？但是，我尝试使用以下命令定义 CoffeeScript 函数:window.pdtogglecs、this.pdtogglecs、root.pdtogglecs，而 coffescript 函数总是因该错误而失败。

我错过了什么？

谢谢!!

Answer 1

你有两个问题，一个是 CoffeeScript 语法有点困惑，另一个是你所了解的命名空间问题。

我们将首先解决您的语法困惑。这:

f(x) -> ...

解释如下:

f(x)(-> ...)

所以当给出这个时:

pdtogglecs(id) ->
   jQuery('div .partybackground').removeClass("hidden")

CoffeeScript 认为您正在尝试将 pdtogglecs 作为函数调用，并以 id 作为参数。然后它认为 pdtogglecs(id) 返回一个函数，并且您希望使用 -> jQuery(...) 函数作为参数来调用该函数。所以它最终有点像这样:

callback = -> jQuery(...)
returned_function = pdtogglecs(id)
returned_function(callback)

这与您原来的 JavaScript 完全不同。您想要创建一个名为 pdtogglecs 的函数，它接受 id 作为参数，然后运行您的 jQuery 内容:

pdtogglecs = (id) ->
    # -----^ this is sort of important
    jQuery('div .partybackground').removeClass("hidden")

您可以通过查看生成的 JavaScript 来了解发生了什么。

命名空间问题很简单，您可能可以根据您发现的其他问题来解决这个问题。不过，为了完整性，我会在这里处理它。

CoffeeScript 将每个 .coffee 文件包装在一个自执行函数中，以避免污染全局命名空间:

(function() {
    // JavaScript version of your CoffeeScript goes here...
})();

该包装器将所有内容的范围限定为 .coffee 文件。如果你想污染全局命名空间，那么你必须这样说:

window.pdtogglecs = (id) -> ...

你也可以说:

@pdtogglecs = (id) -> ...

但我更喜欢直接引用 window 的明确性，这也使您不必担心 @ (又名 this)是什么，当您代码已解析。