js中Promise对象实例详解-js教程-PHP中文网

js中Promise对象实例详解

小云云

发布： 2018-03-06 14:02:21

原创

2618人浏览过

假设我现在有个实名验证页面，需要验证身份证号码和真实姓名，实名认证是到公安部系统验证（假设在前端验证），验证通过后我再将当前表单信息保存到提交到我自己后台保存；

方法一不用promise

//外层ajax，校验实名信息$.ajax({
   type: "POST",
   url: "公安部检验真实姓名和身份证接口",
   dataType:"json",
   data: {name:"王尼玛",idCardNo:"4405************6543"},
   success: function(msg){     
     if(msg.status)
     {        //真实姓名、身份证号码验证通过，提交表单数据到本系统后台
        $.ajax({
           type: "POST",
           url: "/my/info.php", //本系统后台地址
           dataType:"json",
           data: {表单数据},
           success: function(msg){     
             if(msg.success)
             {                //保存成功              
             }             else
             {                //保存失败
             }
           }
        });
     }     else
     {        //真实姓名、身份证号码错误
     }
   }
});

登录后复制

我们很清楚的看到，以上例子需要嵌套ajax实现，实际需求中，凡是嵌套ajax的代码读起来都会很苦逼(多层更苦逼)，当然，有的人会使用同步的ajax实现，但是同步ajax请求时会给用户页面死掉了的感觉【笑哭】；

方法二使用promise

 new Promise(function (resolve, reject) {
            $.ajax({
                type: "POST",
                url: "公安部检验真实姓名和身份证接口",
                dataType: "json",
                data: { name: "王尼玛", idCardNo: "4405************6543" },
                success: function (msg) {
                    if (msg.status) {
                        resolve(msg); //真实姓名、身份证号码通过验证，msg会传入then方法的第一个方法参数
                    }                    else {
                        reject(msg); //真实姓名、身份证号码未通过验证，msg会传入then方法的第二个方法参数
                    }
                }
            });
        }).then(function (resolveMsg) {
            $.ajax({
                type: "POST",
                url: "/my/info.php", //本系统后台地址
                dataType: "json",
                data: { "表单数据": "表单数据" },
                success: function (msg) {
                    if (msg.success) {                        //保存成功              
                    }                    else {                        //保存失败
                    }
                }
            });
        }
        , function (rejectMsg) {
            //真实姓名、身份证号码错误
        });

登录后复制

总结
先说结论：Promise适用于多层嵌套的异步ajax回调；

很明显，区别于方法一的嵌套ajax，方法二的promise结构更清晰，特别是在多层嵌套后，方法二的优势更加明显，多层嵌套后方法一会变成一大坨，非常难看懂，方法二promise可以用：

new Promise().then()
    .then()
    .then()
    .catch();

登录后复制

格式，结构非常清晰的处理；

北极象沉浸式AI翻译

免费的北极象沉浸式AI翻译 - 带您走进沉浸式AI的双语对照体验

查看详情

相关推荐：
Promise的基本使用方法教程

使用Promise简化回调

js中promise实例解析

以上就是js中Promise对象实例详解的详细内容，更多请关注php中文网其它相关文章！