setTimeout在JavaScript中的模板方法模式

Question

我有一个close函数，它将关闭某些实例。包含函数的类允许派生类覆盖close。在这里，我希望确保即使在派生类中，close也总是调用dispose。我通过以下几点来实现这一点。

function close() {
  closeCore();
  dispose();
}

function closeCore() {
  // derived class can override this method.
}

这很好，但有一种情况是，在处理实例之前，我希望执行CSS动画。我就是这么做的。

function close () {
  instance.classList.add("fancy-animation-that-takes-800ms");

  setTimeout(function () {
    dispose();
  },800);
}

但是，一旦我这样做，我使用的模板模式就无法应用。在第二个示例中，是否有方法确保close函数始终调用dispose？

Answer 1

您可能希望close从具有如下参数的closeCore返回一个对象：

return {timeout: 800, callback: function () {/*....will execute after a timeout..*/}};

或者：

return {callback: function () { /*...will be immediately executed...*/}};

或者：

return function () { /*...will be immediately executed...*/};

然后...and为它们调用超时(如果有的话)，然后在超时之后执行它们的回调，然后为它们调用dispose。

close代码的相关部分可能如下所示：

function close() {
  var ccObj = closeCore();
  var ccIsObj = ccObj && typeof ccObj === 'object';
  var callback = typeof ccObj === 'function' ? ccObj : (ccIsObj ? ccObj.callback : null);
  if (ccIsObj && ccObj.timeout) {
    if (!callback) {
      throw 'You must implement a callback when supplying a timeout';
    }
    setTimeout(function () {
        callback();
        dispose();
    }, ccObj.timeout);
  }
  else {
    if (callback) {callback();}
    dispose();
  }
}

但是，如果希望允许用户进行自己的任意异步调用(例如Ajax)，而可以允许返回添加了dispose调用的承诺，则不能保证派生程序将确保承诺完成。您可以在一段时间后自动取消承诺，但除非再次抽象，否则您无法神奇地知道派生代码何时完成。