CoffeeScript 类在使用 $.getScript 加载的脚本中未定义

Question

我将 CoffeeScript 类与 jQuery 结合使用，并通过 ajax 加载另一个 HTML 页面，该页面又引用了另一个 javascript，但在获取 ajax 加载页面以查看父页面在脚本中加载的类时遇到问题：

父页面加载一个javascript文件（从CoffeeScript编译）：

<script src="/assets/global.js?body=1" type="text/javascript"></script>

在 CoffeeScript 文件中有一个类：

class App
  constructor: ->
    ...

我正在加载另一个网页：

$.ajax({
  url: '/import/show', 
  success: (data) =>
    $('#content').html(data)
})

这个页面又引用了另一个 Coffee/JavaScript 文件：

<script src="/assets/import.show.js?body=1" type="text/javascript"></script>

当这个加载的 javascript 文件包含：

alert('test')

按预期发出警报。这表明加载代码工作正常。但是，如果子脚本包含：

app = new App()

我收到一个错误：

Uncaught ReferenceError: App is not defined

如果我将代码放在文档就绪函数中，也会发生这种情况：

$(=> a = new App())

有谁知道如何使父页面加载的脚本中的类在通过 ajax 加载的子页面加载的脚本中可用？

Answer 1

只需在你的班级名称前加上@。

class @App

这将生成以下内容：

(function() {
    this.App = (function() {
    ...

因为你在window是this的时候定义了类，所以它将是全局可访问的。

Answer 2

我想我已经找到了发生这种情况的原因并找到了解决方法。当我查看编译后的脚本（而不是 CoffeeScript）时，我发现了以下内容：

(function() {
    var App
    App = (function() {
    ...

然后我突然意识到，“类 App”将类定义为函数中的 var，这意味着它只能从该 CoffeeScript 文件中访问。

解决方法是让我将我的类定义为：

class window.App
  constructor: ->
    ...

然后将类的范围设置为窗口 DOM 对象，然后可以从 ajax 加载的脚本中访问该对象。

有谁知道是否有更好的方法来做到这一点，或者这似乎是正确的方法？