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

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() {
    ...

由于您在窗口是 this 时定义了类，因此它可以全局访问。

Answer 2

我想我已经发现了为什么会这样，并找到了解决方法。当我查看编译后的脚本（而不是CoffeeScript）时，我发现了以下内容：

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

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

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

class window.App
  constructor: ->
    ...

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

有没有人知道是否有更好的方法来做到这一点，或者这看起来是正确的做法？