• 首页
  • vue
  • TypeScript
  • JavaScript
  • scss
  • css3
  • html5
  • php
  • MySQL
  • redis
  • jQuery
  • deferred.then()

    当Deferred(延迟)对象解决,拒绝或仍在进行中时,调用添加处理程序。

    deferred.then(doneFilter[, failFilter ][, progressFilter ])
    • doneFilter类型:Function()。当Deferred(延迟)对象得到解决时被调用的一个函数。
    • failFilter类型:Function()。[可选]当Deferred(延迟)对象拒绝时被调用的一个函数。
    • progressFilter类型:Function()。[可选]当Deferred(延迟)对象生成进度通知时被调用的一个函数。
    deferred.then(doneCallbacks, failCallbacks)
    • doneCallbacks类型:Function()。当Deferred(延迟)对象得到解决时被调用的一个函数或函数数组。
    • failCallbacks类型:Function()。当Deferred(延迟)对象拒绝时被调用的一个函数或函数数组。
    deferred.then(doneCallbacks, failCallbacks[, progressCallbacks ])
    • doneCallbacks类型:Function()。当Deferred(延迟)对象得到解决时被调用的一个函数或函数数组。
    • failCallbacks类型:Function()。当Deferred(延迟)对象拒绝时被调用的一个函数或函数数组。
    • progressCallbacks类型:Function()。当Deferred(延迟)对象生成进度通知时被调用的一个函数或函数数组。

    在jQuery 1.8之前,参数可以是一个函数或函数数组。

    对于上面所有的特征,如果没有这种类型的回调是需要的,参数可以为null。或者,使用.done().fail()或者.progress()设置只有一种未经过滤的状态或值的回调类型。

    从jQuery 1.8开始,方法返回一个新的promise(承诺),通过一个函数,可以过滤deferred(延迟)的状态和值。替换现在过时的deferred.pipe()方法。doneFilterfailFilter函数过滤原deferred(延迟)的解决/拒绝的状态和值。progressFilter函数过滤器的任何调用到原有的deferred(延迟)的notifynotifyWith的方法。这些过滤器函数可以返回一个新的值传递给的 promise(承诺)的.done().fail()回调,或他们可以返回另一个观察的对象(递延,承诺等)传递给它的解决/拒绝的状态和值promise(承诺)的回调。如果过滤函数是空,或没有指定,promise(承诺)将得到与原来值相同解决(resolved)或拒绝(rejected)。

    回调是依照他们添加的顺序执行的。一旦deferred.then返回Promise(承诺),链接其它的延迟对象,包括增加.then()方法。有关详细信息,请参阅文件Deferred object 。

    例子

    由于 jQuery.get 方法返回 jqXHR 对象,该对象继承自延迟对象,所以我们可以添加.then 方法。

    $.get("test.php").then(
        function(){ alert("$.get succeeded"); },
        function(){ alert("$.get failed!"); }
    );
    

    Filter the resolve value:

    <!DOCTYPE html>
    <html>
    <head>
      <script src="https://www.lanmper.cn/static/js/jquery-3.5.0.js"></script>
    </head>
    <body>
     
    <button>Filter Resolve</button>
    <p></p>
     
    <script>
    var filterResolve = function() {
     
      var defer = $.Deferred(),
          filtered = defer.then(function( value ) {
            return value * 2;
          });
     
      defer.resolve( 5 );
      filtered.done(function( value ) {
        $( "p" ).html( "Value is ( 2*5 = ) 10: " + value );
      });
    };
     
    $( "button" ).on( "click", filterResolve );
    </script>
     
    </body>
    </html>
    

    Filter reject value:

    var defer = $.Deferred(),
        filtered = defer.then( null, function( value ) {
          return value * 3;
        });
     
    defer.reject( 6 );
    filtered.fail(function( value ) {
      alert( "Value is ( 3*6 = ) 18: " + value );
    });
    

    Chain tasks:

    var request = $.ajax( url, { dataType: "json" } ),
        chained = request.then(function( data ) {
          return $.ajax( url2, { data: { user: data.userId } } );
        });
     
    chained.done(function( data ) {
      // data retrieved from url2 as provided by the first request
    });
     
    

    上篇:deferred.resolveWith()

    下篇:promise()