jquery Deferred 对象应用实例

不了解jquery deferred对象的先google一下“javascript promise模式”和“jquery deferred对象”。搜到的几篇都讲得比较详细了。一下只列出常见的用途。

1.我有两个异步操作f1和f2，f2需要依赖f1异步返回的结果，不写成回调，如何做？

先考虑我希望写成的样子：

//f3用来确定f2返回的结果
f1().pipe(f2).then(f3);

　　再看f1和f2实现就很简单了：

var f1 = function(){
        var _i = $.Deferred();
        setTimeout(function(){
            _i.resolve("f1的返回结果");
        },1000);
        
        return _i;    
}

var f2 = function(data){
    var _i = $.Deferred();
    console.log( data);
    setTimeout(function(){
            _i.resolve("f2的返回结果");
    },1000);
    return _i;
}

var f3 = function( data ){
    console.log( data );
}

 

2.我有f1和f2两个一步操作，不互相依赖，但是希望在两者都完成后再执行操作f3，如何做？

　　以下直接抄自jquery 手册

$.when($.ajax("/page1.php"), $.ajax("/page2.php")).done(function(a1,  a2){
    //a1和a2分别是两个ajax的返回结果
   var jqXHR = a1[2]; /* arguments are [ "success", statusText, jqXHR ] */
   if ( /Whip It/.test(jqXHR.responseText) ) {
      alert("First page has 'Whip It' somewhere.");
   }
});

3.deferred对象还有个有意思的notify对象。这个方法可以再resolve和reject之前通知progress callback来进行相应的操作。