Question

假设我有脚本A加载另一个脚本B：

$.getScript('B.js',foo);

但是如果B还加载了一个脚本呢？然后我希望在foo加载 AND 加载的脚本后执行B。因此在加载整个链之后执行foo。

请注意，B个依赖关系应该对A透明，因此我不能只将脚本添加到A而不是B。

怎么做？

Answer 1

对于复杂的脚本间依赖关系，我认为唯一的出路是使用模块引擎，在本例中为RequireJS。

假设您是A和B背后的程序员，对于每个模块，您可以使用RequireJS函数声明它们作为模块的存在，并指示每个模块依赖于哪个模块（这是通过RequireJS的define（）函数完成的）

然后你可以使用RequireJS中的require（）函数加载它们，引擎将以适当的顺序加载脚本。

Answer 2

您的问题的一个解决方案是使用AMD模式和RequireJS

以下是阅读有关AMD的一些链接：

http://requirejs.org/docs/whyamd.html

http://addyosmani.com/writing-modular-js/

具体来说，

AMD模块格式本身是一个定义模块的建议模块和依赖项都可以异步加载。它有一些独特的优点，包括异步和本质上非常灵活，可以消除紧耦合通常在代码和模块标识之间找到。

例如，您的代码可以像这样更新：

define(['foo', 'B'], function(fooModule,B){
   // at this point, if you have a foo.js file that provides function foo(){},
   // plus B.js is loaded
   fooModule.foo();

});

但这需要你（至少）有三个其他文件：

foo.js

define(function(){
   return {
     foo : function () {
        // this foo function doesn't depend on any other modules
     };
  });

B.js

define(['A'],function(A){
   function privateBfunction1() {
      // can use A's interface here
      A.publicA();
   }

   function publicBfunction2() {
      // can use A's interface here
   }

   // public api
   return {
     publicB : publicBfunction2
  };
});

A.js

// another way to specify no dependencies, an empty array and no function args
define([],function(){

   // public api
   return {
     publicA :    function publicAfunction2() {
     }

  };
});

如何加载Javascript及其依赖项？

2 个答案: