延期与承诺

Question 1

除jQuery版本外，Deferred和Promise有什么区别？

我该怎么用？我只想打电话给fooExecute()。例如，我只需要fooStart()和fooEnd()即可切换html div状态。

//I'm using jQuery v2.0.0
function fooStart() { /* Start Notification */ }
function fooEnd() { /* End Notification */ }
function fooExecute() { /* Execute the scripts */ }

$('#button1').on('click', function() {
    var deferred1 = $.Deferred();
    var promise1 = $.Promise();

    deferred1.???

    promise1.???
});

Question 2

第一：您不能使用，$.Promise();因为它不存在。

一个延迟的对象是一个对象，可以创建一个承诺，并改变其状态resolved或rejected。如果您编写自己的函数并希望对调用代码提供承诺，则通常使用Deferreds。您是价值的生产者。

一个承诺，正如它的名字说，一个关于未来价值的承诺。您可以在其上附加回调以获取该值。诺言已“兑现”给您，您就是未来价值的接受者。
您无法修改承诺的状态。只有创建承诺的代码才能更改其状态。

例子：

1.（产生）要为自己的功能提供承诺支持时，可以使用延迟对象。您计算一个值，并希望控制何时兑现承诺。

function callMe() {
    var d = new $.Deferred();
    setTimeout(function() {
        d.resolve('some_value_compute_asynchronously');
    }, 1000);
    return d.promise();
}

callMe().done(function(value) {
    alert(value);
});

2.（转发）如果调用的函数本身返回一个Promise，则不必创建自己的延迟对象。您可以兑现承诺。在这种情况下，该函数不会创建值，但会转发它（某种）：

function fetchData() {
    // do some configuration here and pass to `$.ajax`
    return $.ajax({...});
}

fetchData().done(function(response) {
    // ...
});

3.（接收）有时您不想创建或传递承诺/值，而是想直接使用它们，即您是某些信息的接收者：

$('#my_element').fadeOut().promise().done(function() {
    // called when animation is finished
});

当然，所有这些用例也可以混合使用。您的函数可以是值的接收者（例如，来自Ajax调用），并以此为基础计算（产生）不同的值。

相关问题：

Question 3

Promise是可以在延迟对象完成时执行的延迟对象上设置的。

jQuery文档中的示例：

<!DOCTYPE html>
<html>
<head>
  <style>
div {
  height: 50px; width: 50px;
  float: left; margin-right: 10px;
  display: none; background-color: #090;
}
</style>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>

<button>Go</button>
<p>Ready...</p>
<div></div>
<div></div>
<div></div>
<div></div>


<script>
$("button").on( "click", function() {
  $("p").append( "Started...");

  $("div").each(function( i ) {
    $( this ).fadeIn().fadeOut( 1000 * (i+1) );
  });

  $( "div" ).promise().done(function() {
    $( "p" ).append( " Finished! " );
  });
});
</script>

</body>
</html>

它在JSFiddle中

这将在每个函数上运行一个函数，div并.promise在所有.each执行完成后执行代码。