如何在 CoffeeScript 和 Rails 6 中调用函数？

Question

我正在尝试遵循我认为是在旧版本的 Rails 上完成的动作电缆教程。他们在 CoffeeScript 中使用了以下函数。但是，当我尝试运行它时，控制台会打印出附加到相应尝试的代码块的错误。第一个块是教程，第二个块是我试图解决这个问题。

问题是本教程没有明确解释 APP 的用途或它所代表的含义。

(function() {
    this.App || (this.App = {});
    App.cable = ActionCable.createConsumer();
}).call(this);

Error:
CoffeeScriptError: C:\Users\User\Documents\Projects\ror\ror-portfolio-1-dev-match-master\app\javascript\packs\application_coffee.coffee:23:2: error: reserved word 'function'
(function() {

cableFunc {
    this.App || (this.App = {});
    App.cable = ActionCable.createConsumer();
}

cableFunc()

Error:
CoffeeScriptError: C:\Users\User\Documents\Projects\ror\ror-portfolio-1-dev-match-master\app\javascript\packs\application_coffee.coffee:24:2: error: unexpected this
    this.App || (this.App = {});

如果有人能告诉我为什么这不能编译，因为 CoffeScript 不应该抛出它所抛出的错误，我将不胜感激。

另外，我使用webpacker:install:coffee 在我的应用程序中设置 CoffeeScript。

Answer 1

一个简单的js2coffee 转换将产生：

(->
  @App or (@App = {})
  App.cable = ActionCable.createConsumer()
).call this

图案：

(function() {
    this.App || (this.App = {});
    App.cable = ActionCable.createConsumer();
}).call(this);

是一个过时但非常常见的 JS 习惯用法，用于定义全局变量。尽管使用 IIFE（立即调用函数表达式）比使用 call 和 this 更常见。

(function(global) {
  global.App || (global.App = {});
  App.cable = ActionCable.createConsumer();
}(window));

这个想法是，不是每个库都使用其函数（或像 Prototype 那样增加内置对象），而是在全局范围内坚持自己的对象。将声明包装在函数中会创建一个作用域，您可以在其中声明“私有”函数和变量，而不会泄漏到全局作用域中。

这个习惯用法早于真正的 javascript 模块和 exports 和 imports 关键字。它在 2020 年与 the <marquee> element 一样时髦，并且无法按预期与 webpack 一起使用。

这是因为 webpacker 实际上会将导入视为模块，而 this 不会像在将文件内容连接在一起的 spocket 中那样被视为全局范围。

相反，您需要显式传递全局范围。

(->
  @App or (@App = {})
  App.cable = ActionCable.createConsumer()
).call window