3

我正在使用 RequireJS 来构建我当前的 JS 项目,并且我有一些库/jQuery 插件需要在使用之前进行初始化。初始化是异步的,返回时将调用回调。因此,以下代码引入了竞争条件(依赖项是否已加载初始化?):

dep_that_needs_to_be_initialized_before_it_can_be_used.js:

define(
    ['raw_library_source'],
    function(){
        // this init call is async and will invoke the callback when done
        // $ is global
        $.plugin.init({
            //config
        },callback);
    }
);

应用程序.js:

define(
    ['dep_that_needs_to_be_initialized_before_it_can_be_used'],
    function(){
        // the following line may fail in case the dependcy is not yet initialzed
        $.plugin.doSomething();
    }
);

有谁知道我如何使依赖项“等待”(又名同步)直到库也被初始化?

4

1 回答 1

2

我通常这样做的方式是从插件包装器模块返回一个包装器函数,然后使用回调调用返回的包装器函数。将其与模块闭包中的标志相结合,以指示插件是否已经初始化,我认为您有一个解决方案。

例子:

//pluginWrapper.js
define(
  ['jquery', 'plugins/jquery.plugin'],
  function($) {
    var isInitialized = false;
    return function (callback) {
      if (isInitialized) {
        callback();
      } else {
        $.plugin.init({}, function() {
          isInitialized = true;
          callback();
        });
      }
    };
  }
);

然后,在您想要使用插件的任何模块中,您可以:

define( ['jquery', 'pluginWrapper'],
  function($, pluginWrapper) {
    pluginWrapper(function() {
      // use the plugin here.  it will be initialized.
    }
  }
);

AMD 模块和 javascript 闭包很棒,但是当您刚刚掌握它们时,两者都可能会有点令人困惑。

于 2012-06-14T16:22:01.433 回答