RequireJS和CommonJS之间的区别 [英] Difference between RequireJS and CommonJS

问题描述

我想知道这些片段之间的区别是什么。

I was wondering what the difference between these snippets is.

var $ = require('jquery');
var _ = require('underscore');
var BackBone = require('backbone');

和

require(['jquery','underscore','backbone'],function ($, _, BackBone){
    //code goes here
})

两者都适合我，但不确定是否有上述两个目的。

Both work fine for me, but not sure is their any purpose behind the above two.

推荐答案

考虑第一个片段，它是CommonJS样式：

Consider the first snippet, which is in the CommonJS style:

var $ = require('jquery');
var _ = require('underscore');
var BackBone = require('backbone');

这些调用是同步调用：当 require 时返回，它返回您请求的模块。 CommonJS require 调用是同步的。有一个建议支持 require 的异步形式，但就我而言可以告诉它没有超出提案级别。 Node.js曾经删除了 require.async 。有一个包实现了它。使用这个软件包看起来很像使用AMD风格的模块。

These calls are synchronous calls: when require returns, it returns the module you requested. CommonJS require calls are synchronous. There is a proposal for supporting asynchronous forms of require but as far as I can tell it has not progressed beyond the proposal level. Node.js used to have require.async which has been removed. There's a package that implements it though. Using this package looks at lot like using AMD style modules.

现在，考虑第二个片段，它是AMD风格：

Now, consider the second snippet, which is in the AMD style:

require(['jquery','underscore','backbone'],function ($, _, BackBone){
    //code goes here
})

由于RequireJS实现了AMD类型的模块系统，上面的代码适用于RequireJS 。这个要求调用---正如名称异步模块定义（AMD）所建议的---异步。您不能依赖 require 的返回值来获取模块值。你必须使用回调。 define 调用以类似的方式工作，但除了需要模块外还定义了一个模块。

Since RequireJS implements the AMD type of module system, the above code works with RequireJS. This require call is --- as suggested by the name Asynchronous Module Definition (AMD) --- asynchronous. You can't rely on the return value of require to get a module value. You have to use a callback instead. The define call works in a similar way but defines a module in addition to requiring modules.

现在，如果你使用RequireJS，它提供的设施允许在定义模块时使用任一样式，以便您可以定义这样的模块：

Now, if you use RequireJS, it provides facilities that allow to use either style when you define modules so that you can define a module like this:

define(['jquery','underscore','backbone'],function ($, _, BackBone){
    //code goes here
});

或者使用看起来更像CommonJS成语的东西：

Or use something that looks more like the CommonJS idiom like this:

define(function (require) {
    var $ = require('jquery');
    var _ = require('underscore');
    var BackBone = require('backbone');
    //code goes here
});

这样可以很容易地将CommonJS样式模块转换为与RequireJS一起使用：只需将其包裹起来定义如上调用。有一个工具来帮助转换。

It makes it really easy to convert a CommonJS style module to use with RequireJS: just wrap it with a define call as above. There's a tool to help the conversion.

背后在场景中，RequireJS以第二种形式读取回调代码并创建依赖关系列表，以便最终解释为：

Behind the scenes, RequireJS reads the code of the callback in the 2nd form and creates a list of dependencies so that in the end it is interpreted like:

define(['require', 'jquery','underscore','backbone'], function (require) {
    var $ = require('jquery');
    var _ = require('underscore');
    var BackBone = require('backbone');
    //code goes here
})

可能令人惊讶的是（鉴于AMD是异步的）回调中的 require 调用是同步的。这是RequireJS支持CommonJS风格的一部分。 RequireJS支持一种同步 require 调用但有以下警告：如果在调用同步<$ c $之前模块已已定义c> require ，然后同步 require 返回模块的值，否则立即失败。也就是说，它不会尝试来加载模块。因为RequireJS解释了一个使用CommonJS样式的模块定义，如上所示 - 好像依赖项实际列在 define 参数中 - 然后这些模块保证在同步调用 require 时加载。

It may be surprising (given that AMD is asynchronous) that the require calls in the callback are synchronous. This is part of RequireJS's support for the CommonJS style. RequireJS supports a kind of synchronous require call but with the following caveat: if the module is already defined before the call to the synchronous require, then the synchronous require returns the module's value, but otherwise it fails immediately. That is, it does not try to load a module. Because RequireJS interprets a module definition that uses the CommonJS style as I've shown above --- as if the dependencies were actually listed in the define arguments --- then these modules are guaranteed to be loaded by the time the synchronous calls to require are made.

除了能够使用CommonJS之外RequireJS中的模块（如果添加了包装器），也可以在像Node.js这样的CommonJS环境中使用为RequireJS设计的模块。例如，我使用 node-amd-loader 加载我在Node中设计为AMD模块的模块.js。

Besides being able to use CommonJS modules in RequireJS (provided a wrapper is added), it is also possible to use modules designed for RequireJS in a CommonJS environment like Node.js. For instance, I've used node-amd-loader to load modules I've designed as AMD modules in Node.js.

这篇关于RequireJS和CommonJS之间的区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！