支持相互依赖的 JavaScript 模块模式

Question

看来使用以下 javascript 模块模式，不可能有相互依赖的模块：

var AA = (function(module, BB){
  module.sayHello = function(){
    alert("AA: hello!");
  };
  module.pokeYourFriend = function(){
    BB.sayHello();
  };
  return module;
})(AA || {}, BB);

var BB = (function(module, AA){
  module.sayHello = function(){
    alert("BB: hello!");
  };
  module.pokeYourFriend = function(){
    AA.sayHello();
  };
  return module;
})(BB || {}, AA);


> AA.pokeYourFriend();
*TypeError: Cannot call method 'sayHello' of undefined*

上面的失败是因为 BB 在创建 AA 时不存在。

是否有一种模式允许这样做，或者应该禁止相互依赖？

Answer 1

AA 和 BB 的 RHS 值是函数表达式，按自上而下的顺序（这是 Javascript 中的正常顺序）求值。因此，在定义 BB 之前，不能使用 BB。

您可以使用“构造函数”来创建这些模块并为其分配名称（“AA”或“BB”），而不是自调用：

var create = (function(name) {
   var _friend = null;
   var _name = name;

   return {
      sayHello: function() {
         alert(_name + ": hello!");
      },
      pokeYourFriend: function() {
         if(_friend != null) {
            _friend.sayHello();
         }
      },
      setFriend: function(friend) {
         _friend = friend;
      }
   };
});

var AA = create("AA");
var BB = create("BB");

AA.setFriend(BB);
BB.setFriend(AA);

AA.pokeYourFriend(); //alerts "BB: hello!"
BB.pokeYourFriend(); //alerts "AA: hello!"