将回调添加到以下模块的最佳方法是什么?

时间:2016-06-03 15:10:58

标签: javascript jquery

我有以下模块

var m=(function() {
   // setup variables

   return {
      center: function() {
        // do stuff
      },

      open: function(settings) {

        // do open stuff
        // setups the handler for the close...

            $close.on("click",function(e) {
               e.preventDefault();
               m.close();
            });
      },

      close: function() {
         // do close stuff
         // ** need to add code here 
         //to perform a callback function on close

         // EDIT
         if(this.hasOwnProperty("callback"))
            callback();
      },

      //** EDITED
      addCallback: function(func) {
         this.callback=func;
      }

   };
}());

// open 
m.open();

点击事件自动触发的关闭。我想以某种方式将一个回调插入close(),以便在关闭时执行...我想添加一个像

这样的函数
addCallback(callback) { 
this.callback=callback;
}

但我不确定如何在close()内调用它。

**编辑**

感谢user3297291对于以下响应和Barmar你是对的我实际上只需要一个回调而不是数组。我通过添加addCallback()编辑了上面的代码。然后运行的代码将是:

m.open()
function check() { 
   alert("hello");
}

m.addCallback(check);

但这并不起作用我试图理解为什么和我刚开始使用javascript OO ..

1 个答案:

答案 0 :(得分:2)

您必须跟踪一系列回调(或仅一个)。最简单的实现可能是这样的:



var m = (function() {

  var onCloseCallbacks = [];

  return {
    addOnCloseCallback: function(cb) {
      onCloseCallbacks.push(cb);
    },
      
    close: function() {
      console.log("Closing");
      onCloseCallbacks.forEach(function(cb) {
        cb();
      });
    }
  };
}());


m.addOnCloseCallback(function() {
  console.log("After close");  
});

m.close();




请注意,回调数组是在闭包内定义的。

对于更高级的解决方案,您希望能够从m模块外部处理回调。以下是如何添加此内容的示例:



var m = (function() {

  var onCloseCallbacks = [];

  return {
    addOnCloseCallback: function(cb) {
      onCloseCallbacks.push(cb);

      return {
        dispose: function() {
          var i = onCloseCallbacks.indexOf(cb);
          
          onCloseCallbacks = onCloseCallbacks
            .slice(0, i)
            .concat(onCloseCallbacks.slice(i + 1));
        }
      };

    },

    close: function() {
      console.log("Closing");
      onCloseCallbacks.forEach(function(cb) {
        cb();
      });
    }
  };
}());


var myCallback = m.addOnCloseCallback(function() {
  console.log("After close");
});

m.close(); // Does trigger cb

myCallback.dispose();

m.close(); // Doesn't trigger cb