与咖啡脚本的多个文件通信

2022-01-24 00:00:00 javascript coffeescript

当我创建一个新的咖啡脚本文件时,我无法从另一个文件访问已编译代码中的代码,因为它被包装在某个函数范围内.例如:

When I create a new coffeescript file, I cannot access the code in the compiled code from another file because it gets wrapped in some function scope. For example:

CoffeeScript:

CoffeeScript:

class ChatService
  constructor: (@io) ->

生成的 Javascript:

Generated Javascript:

(function() {
  var ChatService;    
  ChatService = (function() {    
    function ChatService(io) {
      this.io = io;
    }    
    return ChatService;    
  })();    
}).call(this);

当试图在另一个文件中调用 ChatService 时,它没有被定义.如何使用 coffeescript 处理多个文件?

When trying to call ChatService in another file, it's not defined. How do I handle multiple files with coffeescript?

推荐答案

根据这是客户端代码还是服务器端代码,有两种略有不同的方法.

Depending on whether this is client- or server-side code, there are two slightly different approaches.

客户端:这里我们将跨文件可用的东西附加到全局命名空间(window),如下所示:

Client-side: Here we attach things that should be available across files to the global namespace (window) as follows:

class window.ChatService
  constructor: (@io) ->

然后,在另一个文件中,ChatServicewindow.ChatService 都将允许访问该类.

Then, in another file both ChatService and window.ChatService will allow access to the class.

Server-side:这里我们必须使用exportsrequire.在 ChatService.coffee 文件中,您将拥有以下内容:

Server-side: Here we must use exports and require. In the ChatService.coffee file, you would have the following:

class exports.ChatService
  constructor: (@io) ->

然后,要从另一个文件中获取它,您可以使用:

Then, to get at it from another file you can use:

ChatService = require('ChatService.coffee').ChatService

注意:如果您从 ChatService.coffee 获得多个类,这是 CoffeeScript 的 dict 解包真正大放异彩的地方,例如:

Note: If there are multiple classes that you are getting from ChatService.coffee, this is one place where CoffeeScript's dict unpacking really shines, such as:

{ChatService, OtherService} = require('ChatService.coffee')

<小时>

两者:基本上,我们根据所处的环境选择是运行服务器端代码还是客户端代码.一种常见的方法:


Both: Basically, we choose whether to run server-side or client-side code based on which environment we're in. A common way to do it:

class ChatService
  constructor: (@io) ->

if typeof module != "undefined" && module.exports
  #On a server
  exports.ChatService = ChatService
else
  #On a client
  window.ChatService = ChatService

得到它:

if typeof module != "undefined" && module.exports
  #On a server
  ChatService = require("ChatService.coffee").ChatService
else
  #On a client
  ChatService = window.ChatService

可以跳过第二个块的 else 子句,因为 ChatService 已经引用了附加到 window 的引用.

The else clause of the second block can be skipped, since ChatService already refers to the reference attached to window.

如果你要在这个文件中定义很多类,那么定义它们可能更容易:

If you're going to define a lot of classes in this file, it may be easier to define them like:

self = {}

class self.ChatService

然后像 module.exports = self 在服务器上附加它们,在客户端附加 _.extend(window, self) (替换 _.extend 与另一个 extend 函数(视情况而定).

And then attach them like module.exports = self on the server and _.extend(window, self) on the client (replace _.extend with another extend function as appropriate).

相关文章