使用 dummy 和空的 jQuery 承诺

Question

我使用 jQuery promises 运行多个动画并在它们完成后执行一些操作：

$.when(foo(),  
       bar(),  
       baz())  
 .done(allDone);  

每个函数（foo 等）都返回一个 jQuery.Promise()。

现在说我想包含一个不为任何东西设置动画的函数，但它的时间与动画有关 - 我不能将它包含在链中，因为它不返回承诺。

所以我可以这样破解它：

function qux() {
  if (something) {
    return $(".whatever")
      .removeClass("bob")
      .addClass("fred")
      .append(/*...do stuff...*/)
      .animate({ left: "+=0" }, 0, callback ) // <-- dummy animation does nothing
      .promise();                             // <-- this is a dummy promise
  }
  else {
    return $().promise();                     // <-- this is an "empty" promise
  }
}

现在我可以链接它了：

$.when(foo(),  
       bar(),  
       baz(),
       qux())  
 .done(allDone);  

这行得通。但我在这里违反了规则 - 是否有任何我没有考虑到的陷阱，或者我以某种方式踩到了 fx 队列？

更新
根据下面的答案，qux() 函数可以重写为：

function qux() {
  if (something) {
    $(".whatever")
      .removeClass("bob")
      .addClass("fred")
      .append(/*...do stuff...*/);
  }
}

Answer 1

如果你打算将它与$.when 一起使用，你不需要返回一个空的承诺。 $.when 可以处理非承诺。 Demo.

function promise(flag) {
    if(flag) {
        var dfd = $.Deferred();
        setTimeout(function(){
            console.log('promise');
            dfd.resolve();
        }, 1000);
        return dfd.promise();
    }

    console.log('promise');
}

$.when(promise(), promise(true), promise(), 15).done(function(){
    console.log('Done');    
});

如果你想返回一个空头承诺，你可以使用$.Deferred().resolve().promise()

Answer 2

如果您的函数始终是同步的 - 只需不要返回承诺：

function qux() {
  if (something) {
    return $(".whatever")
      .removeClass("bob")
      .addClass("fred")
      .append(/*...do stuff...*/);
  }
}

你仍然可以在$.when 中使用它，但是因为它是同步执行的，所以没什么意义。你不应该从同步函数中返回 Promise。

但是，如果您的函数有时是同步的 - 它应该总是返回一个保证一致性的承诺。

正如我在之前的 cmets 中所说的 - $.when 完全可以处理非承诺（它会将它们视为承诺）。因此，可能返回承诺的函数可以与 $.when 一起使用，但是如果它始终是同步的，那么这样做是多余的。