Question

我的很多网站的对象都有非常相似的行为。他们都需要在打开和关闭时切换＆＃34;切换。

我使用toggle()方法，根据bool open()调用close()或isOpen方法，但似乎我只能传入一个回调（在这种模式中）。

如何为每个toggle方法调用传递不同的回调？
我应该将toggle()方法移出Openable吗？
我是否应该使用toggle()方法？

My＆＃34; openable＆＃34;行为对象：

// Openable Behaviour
var Openable = function Openable() {
  var isOpen = false;

  // Open
  function open(callback) {
    isOpen = true;
    callback && callback();
  }

  // Close
  function close(callback) {
    isOpen = false;
    callback && callback();
  }

  // Toggle
  function toggle(callback) {
    isOpen ? close(callback) : open(callback);
  }

  return {
    get isOpen() {
      return isOpen;
    },
    open: open,
    close: close,
    toggle: toggle
  };
};

我的另一个具有可开启行为的对象：

var Other = function Other(element) {
  var openable = Openable();

  element.addEventListener('click', function(event) {
    event.preventDefault();
    openable.toggle(/* what goes here? */);
  });

  function openCallback() {
    console.log("open!");
  }

  function closeCallback() {
    console.log("closed!");
  }

  return {
    target: element
  };
};

var myToggleObject = Other(myElement);

注意： - 我正在使用"revealing module pattern"（我认为），因为它允许我创建一个对象而无需使用this。

Answer 1

您可以创建一个执行此操作的toggleCallback方法：

function toggleCallback() { 
  openable.isOpen() ? openCallback() : closeCallback();
};

并将其传递给点击监听器中的toggle方法。

Answer 2

如何为每个toggle方法调用传递不同的回调？

您可以将多个回调传递给一个函数，所以

  function toggle(callback) {
    isOpen ? close(callback) : open(callback);
  }

变为：

  function toggle(openCallback, closeCallback) {
    isOpen ? close(closeCallback) : open(openCallback);
  }

我应该将toggle（）方法移出Openable吗？

取决于您的代码的组织。我认为，只要很明显该功能处于“可打开”状态就可以了。

我是否应该使用toggle（）方法？

取决于您的代码。我可以看到它对用户界面很有用。

＆＃34;切换对象＆＃34;使用闭合的组合物

2 个答案: