jquery Promise和ES6 Promise的区别

1. Deferred对象有resolve和reject方法，可以直接修改状态

jquery用Deferred实现了Promise规范，Deferred与ES6 Promise的最大区别是：

Deferred对象有resolve()和reject()方法，可以直接随时修改该对象的状态。

比如：

var def = $.Deferred();

setTimeout(function(){
    //...
    def.resolve(data);
});

//可用直接用：
def.resolve('...') //修改其状态，干扰了真正的异步流程的触发。

2. jquery的Promise对象是一个受限的Deferred对象，即没有resolve和reject方法的对象

通过deferred.promsie()可以返回一个jquery版本的promise对象，其实就是一个去除了resolve和reject方法的deferred对象，

目的是防止意外的修改了promise对象的状态，影响真正的异步操作

 

3. Deferred对象的then方法的进化

// version added: 1.5, removed: 1.8
deferred.then( doneCallbacks, failCallbacks )
// version added: 1.7, removed: 1.8
deferred.then( doneCallbacks, failCallbacks [, progressCallbacks ] )
// version added: 1.8
deferred.then( doneFilter [, failFilter ] [, progressFilter ] )
//catch是then( null, fn )的别名
deferred.catch(failFilter)

deferred对象的then方法中的回调，在jquery1.8之前是不会修改传递数据的，在1.8之后开始变为filter，与ES6 Promise的then一致，

会修改传递的数据。

deferred的done和fail方法也是callback方法，不会修改传递的数据

deferred.done( doneCallbacks [, doneCallbacks ] )
deferred.fail( failCallbacks [, failCallbacks ] )

4. 用jquery Deferred实现公共的ajax

//done，fail实现，不能直接返回$.ajax，只能返回外部的deferred对象
app.ajax = function(button, url, data) {
    if (button) {
        button.prop("disabled", true);
    }
    var deferred = $.Deferred();
    $.ajax(url, {
        type: "post",
        dataType: "json",
        data: data
    }).done(function(json) [
        if (json.code !== 0) {
            showError(json.message || "操作发生错误");
            deferred.reject();
        } else {
            deferred.resolve(json);
        }
    }).fail(function() {
        showError("服务器错误，请稍后再试");
        deferred.reject();
    }).always(function() {
        if (button) {
            button.prop("disabled", false);
        }
    });
    return deferred.promise();
};

//then实现，可以返回$.ajax，因为then会返回内部的新的Promise，将值传递
app.ajax = function(button, url, data) {
    if (button) {
        button.prop("disabled", true);
    }
    return $.ajax(url, {
        type: "post",
        dataType: "json",
        data: data
    }).then(function(json) {
        if (json.code !== 0) {
            showError(json.message || "操作发生错误");
            //不必关心promise对象是哪个，只需要能将数据传递下去就行
            return $.Deferred().reject().promise();
        } else {
            return $.Deferred().resolve(json).promise();
        }
    }, function() {
        showError("服务器错误，请稍后再试");
        return $.Deferred().reject().promise();
    }).always(function() {
        if (button) {
            button.prop("disabled", false);
        }
    });
};

// 调用
app.ajax("do/example", getFormData()).done(function(json) {
    // json.code === 0 总是成立
    // 正常处理 json.data 就好
});

 

参考：https://www.w3cschool.cn/ivmkf/ivmkf-tkpq2518.html

         https://www.cnblogs.com/lvdabao/p/jquery-deferred.html