JavaScript异步编程（三） Promise和Deferred对象

Promise和Deferred对象

 

如今jQuery中全部的Ajax函数多会返回Promise对象。

Promise对象表明一项有两种可能结果（成功或失败），并持有多个回调。

之前：

$.get(url, {

    success: onSuccess,

    failure: onFailure,

    always: onAlways

});

如今

var promise = $.get(url);

promise.done(onSuccess);

promise.fail(onFailure);

promise.always(onAlways);

 

变化：如今是在触发Ajax调用以后再附加回调的。

好处：实现封装。Ajax调用部分的代码分离，再也不像之前同样去处理以后的事情。

 

Promise对象也和EventEmitter对象同样，容许向同一个事件绑定任意多的处理器；

Promise对象最大优点在于，能够从现有Promise对象派生出新的Promise对象。

 

生成Promise对象

Deferred是Promise的超集，它比Promise多了一项关键特性：可直接触发。

纯Promise实例只容许添加多个调用，且必须由其余东西来触发这些调用。

而使用resolve和reject方法都可触发Deferred对象。

 

var deferred = new $.Deferred();

deferred.always(function() {…});

deferred.done(function() {…});

deferred.fail(function() {…});

 

$(‘#palyGame’).focus().on(‘keypress’, function(e) {

    var Y = 121, N = 110;

    if(e.keyCode === Y) {

    deferred.resolve();

} else if(e.keyCode ===N ) {

    deferred.reject();

} else {

    return false;

}

});

 

Promise 只能执行或拒绝一次，以后就失效了。

咱们断言，Promise 对象会一直保持挂起状态，直到被执行或拒绝。

 

生成纯Promise对象

Deferred对象调用promise()方法便可；

每一个Deferred对象都含有一个Promise对象，而每一个Promise对象都表明着一个Deferred对象。有了Deferred对象，就能够控制其状态，而有了纯Promise对象，只能读取其状态及附加回调。

 

执行或拒绝Deferred对象时，提供的任何参数都会转发到相应的回调。

 

进度通知

var nanowrimoing = $.Deferred();

var wordGoal = 20;

nanowrimoing.progress(function(wordCount) {

    var percentComplete = Math.floor(wordCount/wordGoal *100);

    $('#indicator').text(percentComplete + '% complete');

});

nanowrimoing.done(function() {

    $('#indicator').text('Good job!');

});

 

$('#editor').on('keypress', function() {

    var wordCount = $(this).val().length + 1;

    if(wordCount >= wordGoal) {

    nanowrimoing.resolve();

}

nanowrimoing.notify(wordCount);

});

 

Promise 对象接受3 种回调形式：done、fail 和progress。

执行Promise 对象时，运行的是done 回调；

拒绝Promise对象时，运行的是fail 回调；

对处于挂起状态的Deferred 对象调用notify 时，运行的是progress 回调。

 

Promise对象的合并

$.when();

 

管道链接

JavaScript没法便捷地执行一系列异步任务，一个主要缘由是没法再第一个任务结束以前就向第二个任务附加处理器。

var getPromise = $.get('/query');

getPromise.done(function(data) {

var postPromise = $.post('/search', data);

});

// 如今咱们想给postPromise 附加处理器……

在GET 操做成功以前咱们没法对postPromise对象绑定回调，

由于这时postPromise 对象还不存在。

解决方案：

var getPromise = $.get('/query');

var postPromise = getPromise.pipe(function(data) {

return $.post('/search', data);

});

pipe 最多能接受3个参数，它们对应着Promise 对象的3 种回调类型：done、fail 和progress。