ES6 JavaScript Promise的初识

怼烎@ 2022-07-27 11:58 173阅读 0赞

如果要实现一个并发的异步操作，执行A、B、C三件事情，但是又要按照顺序来执行，先A再B再C的顺序。

以前做法：

$.ajax({ url: "A.html", context: document.body, success: function(){ 
            //这里是A事情，先执行
            $.ajax({ url: "B.html", context: document.body, success:function(){ 
                  //再A回调中执行B，也就是A完成以后执行B
                    $.ajax({ url: "C.html", context: document.body, success: function(){ 
                            //在B回调中执行C
                    }});
            }});
    }});

有没有发现，这种处理代码必须是层层嵌套，如果层次一多，简直要命。

Promise帮我们解决这个问题：

var Request = function(name) {
        return new Promise(function(resolve, reject) {
             $.ajax({ url: name , context: document.body, success: function(){
                            //在B回调中执行C
             }});
       });
    };
    
    Request("A.html")                                // 执行A，然后...
    .then(function() { return Request("B.html"); })  // 执行B，然后...
    .then(function() { Request("C.html"); })  // 执行C，然后...

有没有发现Promise的作用，既可以不用层层嵌套，又可以保证异步执行的A、B、C的执行顺序。  
注意：resolve()千万别忘记写了，它是给Promise的一个反馈；then中一定要return 一个Promise的对象才能有下一个then函数。

发表评论取消回复

表情：

评论列表（有 0 条评论，173人围观）

还没有评论，来说两句吧...

相关阅读

相关初识promise

一.什么是Promise? Promise是JS异步编程中的重要概念，异步抽象处理对象，是目前比较流行Javascript异步编程解决方案之一。二.Promise使用

曾经终败给现在/ 2023年07月08日 02:40/ 0 赞/ 107 阅读

相关 ES6的Promise语法初使用

Promise是一种异步编程的解决方案；（个人理解：譬如说一个需求需要两个请求将结果返回后才能处理，这时用Promise就很方便）我们可以用setTimeout来模拟网络请

太过爱你忘了你带给我的痛/ 2022年12月01日 14:03/ 0 赞/ 162 阅读

相关【视频教程】Javascript ES6 教程36—ES6 模块初识

![bbe50fdfd0ce947cdfdcce6426088f3a.png][] 在前面，我们一起学了前35节的内容，今天我们开始第36节的内容《构建一个自己的模块

缺乏、安全感/ 2022年09月09日 04:38/ 0 赞/ 177 阅读

相关【视频教程】Javascript ES6 教程35—ES6 模块初识

![038f273836750f405e9977c8eae8eb75.png][] 在前面，我们一起学了前34节的内容，今天我们开始第35节的内容《 ES6 模块初识》

谁借莪１个温暖的怀抱￠/ 2022年09月06日 14:28/ 0 赞/ 154 阅读

相关 ES6 JavaScript Promise的感性认知

ES6 JavaScript Promise的感性认知 by [zhangxinxu][] from [http://www.zhangxinxu.com][zhangx

男娘i/ 2022年08月05日 05:20/ 0 赞/ 109 阅读

相关 ES6 JavaScript Promise的初识

如果要实现一个并发的异步操作，执行A、B、C三件事情，但是又要按照顺序来执行，先A再B再C的顺序。以前做法： $.ajax({ url: "A.html", co

怼烎@/ 2022年07月27日 11:58/ 0 赞/ 174 阅读

相关 es6 Promise

传统实现异步操作就是采用回调函数，回调函数方式本身没有什么问题，但是在多重回调层层嵌套的情况下，那么代码的可阅读性就会出现问题。 Promise对象是一个新的异步操作解决方

曾经终败给现在/ 2022年06月09日 14:45/ 0 赞/ 260 阅读

相关 ES6-Promise

1. Promise的基础 (1)js的异步操作: a. ajax请求 b. 浏览器事件 c. 定时，setTime setInteval

ゞ浴缸里的玫瑰/ 2022年05月15日 07:52/ 0 赞/ 297 阅读

相关 ES6 promise

作用：就是解决异步回调问题的 let promise = new Promise(function(resolve, reject){ })

小灰灰/ 2022年04月13日 06:14/ 0 赞/ 572 阅读

相关初识ES6

1、ECMAScript的官网地址：http://www.ecma-international.org/cma-262/6.0/，其是JS语言的下一代标准，已经在2015年6月

「爱情、让人受尽委屈。」/ 2021年11月16日 05:30/ 0 赞/ 236 阅读