RequireJS : 嵌套的 require 调用答案

【问题标题】：RequireJS : nested require callsRequireJS : 嵌套的 require 调用
【发布时间】：2013-01-23 19:12:05
【问题描述】：

我有一个场景，我嵌套了 require() 调用来加载不同的模块。

我有没有办法确保在调用回调函数之前，所有 require() 调用及其所有子 require() 调用都已完全加载？

有没有办法指定 require() 调用是同步的？

function someFunction(callback) {

  //top level require
  require([...], function(...) {

     //nested require
     require([...], function(...) {
     });

     //nested require
     require([...], function(...) {
     });

  });

  callback();
};

【问题讨论】：

你不应该使用依赖项吗？
是的。但是，我们正在尝试将我们的东西分成单独的文件。例如，上面的代码在 FileA.js 中。 FileB.js 使用其回调调用 someFunction()。然而，它的回调依赖于 FileA.js 的 require() 回调中发生的一些设置。问题是 require 的异步特性意味着回调是在 require() 中的依赖项设置之前执行的。

标签： javascript requirejs

【解决方案1】：

需要在最后一个require(...)函数中执行callback：

function someFunction(callback) {
   require(['somemodule'], function(someModule) {
     // do stuff with someModule...

     // execute callback
     callback(); 
   });
}

您还可以指定您的dependencies with the define function。

例子：

define('somemodule', ['somedependency'], function(someDependency) {
   // return somemodule
   return {
     someProperty: someDependency.getProperty();
   };
});

function someFunction(callBack) {
   var someModule = require('somemodule');   
   var foo = someModule.someProperty;

   return callBack(foo);
}

【讨论】：

【解决方案2】：

有一种方法可以使require 呼叫同步。使其成为 CommonJS 风格：

var module = require('modulepath')

因此，如果您不在嵌套的 require 调用中需要工厂函数，您可以通过这种方式“同步”require 调用......但是既然这样做了，那么您就不走运了。

AMD 风格的requre(depsArray, factoryFn) 就像将您的代码推入并行线程一样。无法使其“同步”，但您可以使用“信号量”来协调结果。

您的问题的答案也很大程度上取决于嵌套 A 和嵌套 B 消耗的内容。如果它们依赖于某些产品，那么您绝对必须使用“线程信号量”，并且不能将嵌套的 require 调用推送到命名的定义调用中：

function someFunction(callback) {

  var resultOfOuterCode = someResultOfCalculations

  //top level require
  require([...], function(...) {

    var resultOfTopRequireCode = someOtherResultOfCalculations

    var semaphore = {
      'count': 2 // represents the number of thread that need to be "done" before 
      , 'callback':callback // this callback is fired.
      , 'checkIfLast': function(){
        this.count -= 1
        if (!this.count) {
          // count is now 0 - time to run our callback
          this.callback()
        }
      }
    }

    //nested require A
    require([...], function(...) {
      // using resultOfTopRequireCode // <-- !!!! this is important part
      ...
      semaphore.checkIfLast()
    });

    //nested require B
    require([...], function(...) {
      // using resultOfTopRequireCode // <-- !!!! this is important part
      semaphore.checkIfLast()
    });

  });

};

换句话说，只需将 require(dependsArray, factoryFn) 视为“线程”，并将您对使用线程的理解应用到它。

【讨论】：