Разница между RequireJS и CommonJS

Question

Мне было интересно, какая разница между этими фрагментами.

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

и

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

Оба работают хорошо для меня, но не уверен, что их любая цель позади выше двух.

Answer 1

Рассмотрим первый фрагмент, который в стиле CommonJS:

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

Эти вызовы являются синхронные вызовы: когда require возвращается, он возвращает модуль, который вы просили. CommonJS require звонки синхронны. Существует предложение о поддержке асинхронных форм require, но до I can tell он не продвинулся дальше уровня предложения. У Node.js использовался require.async, который был удален. Есть package, который его реализует. Использование этого пакета выглядит так же, как использование модулей стиля AMD.

Теперь рассмотрим второй фрагмент кода, который в стиле AMD:

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

С RequireJS реализует тип AMD системы модуля, приведенный выше код работает с RequireJS.Этот вызов require --- как предлагается по имени Asynchronous Module Definition (AMD) --- асинхронный. Вы не можете рассчитывать на возвращаемое значение require, чтобы получить значение модуля. Вместо этого вы должны использовать обратный вызов. Вызов define работает аналогичным образом, но определяет модуль в дополнение к требуемым модулям.

Теперь, если вы используете RequireJS, он предоставляет средства, позволяющие использовать любой стиль, когда вы определяете модули, так что вы можете определить модуль, как это:

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

Или использовать что-то, что больше похоже на CommonJS Фразеологизм, как это:

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

это делает его очень легко преобразовать модуль стиль CommonJS для использования с RequireJS: просто оберните его define вызова, как описано выше. Для преобразования вам нужен tool.

За кулисами, RequireJS считывает код обратного вызова в 2-форме и создает список зависимостей, так что в конце концов, это интерпретируется как:

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 вызова, но со следующей оговоркой: если модуль уже определяется перед вызовом синхронной require, то синхронный require возвращает значение модуля, но в остальном он не сразу. То есть, это не попробуйте загрузить модуль. Поскольку RequireJS интерпретирует определение модуля, которое использует стиль CommonJS, как показано выше, как если бы зависимости были фактически перечислены в аргументах define --- тогда эти модули гарантированно будут загружены к моменту синхронных вызовов require сделаны.

Помимо возможности использования модулей CommonJS в RequireJS (при условии добавления оболочки), также возможно использовать модули, предназначенные для RequireJS, в среде CommonJS, например Node.js. Например, я использовал node-amd-loader для загрузки модулей, которые я разработал как модули AMD в Node.js.

Answer 2

Бывший фрагмент придерживается спецификации CommonJS, в которой описывается, как модули должны быть экспортированы/транспортированы для использования в других модулях.

Таким образом, вы можете написать код, который может выглядеть как этот

SRC/ExpressModule.js

var express = require('express'); 
// do initialization 
exports.express = express; 

И тогда вы можете использовать его как этот

Src/UserExpressModule. js

var express = require('./ExpressModule'); 
// do something else 

Спецификация CommonJS была создана в основном для серверных сред и, в добавок, используется в Node.js

С другой стороны, это спектр AMD, в особенности реализованный RequireJS. AMD была построена для среды браузера или кода на стороне клиента, и здесь вы можете использовать и определить модули, как последний фрагмент кода в код

Применение образца может быть, как это

SRC/main.js

requirejs.config({ 
    baseUrl: '../vendor' 
    path: '../src' 
}); 
require(['jquery', 'underscore', 'backbone'], function($, _, Backbone) { 
    // do some client side computation here 
}); 

Вы можете включить этот main.js файл в index.html, как так

<script data-main="src/main.js" src="vendor/require.js"></script> 

По сути, CommonJS и AMD имеют свои основные спецификации для модуляции Javascript, но нацелены на разные среды исполнения.