先放一张图片感受一下回调地狱

看起来是真的很让人头痛的东西

而现在我这里使用promise对象来解决回调地狱

采用链式的 then,可以指定一组按照次序调用的回调函数。

这时,前一个 then 里的一个回调函数,返回的可能还是一个 Promise对象(即有异步操作),

这时后一个回调函数,就会等待该 Promise对象的状态发生变化,才会被调用。

由此实现异步操作按照次序执行。

var sayhello = function (name) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
console.log(name);
resolve();  //在异步操作执行完后执行 resolve() 函数
}, 1000);
});
}
sayhello("first").then(function () {
return sayhello("second");  //仍然返回一个 Promise 对象
}).then(function () {
return sayhello("third");
}).then(function () {
console.log('end');
}).catch(function (err) {
console.log(err);
})
//输出:first second third end

上面代码中,第一个 then 方法指定的回调函数,返回的是另一个Promise对象。

这时,第二个then方法指定的回调函数,就会等待这个新的Promise对象状态发生变化。

如果变为resolved,就继续执行第二个 then 里的回调函数

promise对象解决回调地狱的更多相关文章

  1. ES6(promise)_解决回调地狱初体验

    一.前言 通过这个例子对promise解决回调地狱问题有一个初步理解. 二.主要内容 1.回调地狱:如下图所示,一个回调函数里面嵌套一个回调函数,这样的代码可读性较低也比较恶心 2.下面用一个简单的例 ...

  2. 【JavaScript】 使用Async 和 Promise 完美解决回调地狱

    很久以前就学习过Async和Promise,但总是一知半解的. 今天在写NodeJS的时候,发现好多第三方库使用回调,这样在实际操作中会出现多重回调,这就是传说中的JS回调地狱. 举个例子 有一个方法 ...

  3. 使用ES6的Promise完美解决回调地狱

    相信经常使用ajax的前端小伙伴,都会遇到这样的困境:一个接口的参数会需要使用另一个接口获取. 年轻的前端可能会用同步去解决(笑~),因为我也这么干过,但是极度影响性能和用户体验. 正常的前端会把接口 ...

  4. Promise如何解决回调地狱

    为什么要有promise:解决(回调地狱)的问题 ### 回调地狱: ```js //跟以前的if条件地狱很像 // if(){ // if(){ // if(){ // } // } //} $.g ...

  5. 回调地狱以及用promise怎么解决回调地狱

    哈哈哈,我又又又回来了,不好意思,最近枸杞喝的比较到位,精力比较旺盛. 现在我们来聊一聊啥是回调地狱,注意是回调地狱啊   不是RB人民最爱拍的那啥地狱啊,来吧,上车吧少年,这是去幼儿园的车 都让开, ...

  6. async + promise 解决回调地狱

    // 解决异步回调地狱的方案: async + promise async function writeFile() {   // 打开文件   const fd = await new Promis ...

  7. Promise解决回调地狱(多层调用问题)

    Promise # Promise 是异步编程的一种解决方案:从语法上讲,promise是一个对象,从它可以获取异步操作的消息:从本意上讲,它是承诺,承诺它过一段时间会给你一个结果.promise有三 ...

  8. Promise,async/await解决回调地狱

    先说一下async的用法,它作为一个关键字放到函数前面,用于表示函数是一个异步函数,因为async就是异步的意思, 异步函数也就意味着该函数的执行不会阻塞后面代码的执行. 写一个async 函数 as ...

  9. Promise解决回调地狱

    Promise是JavaScript异步操作解决方案.介绍Promise之前,先对异步操作做一个详细介绍. JavaScript的异步执行 概述 Javascript语言的执行环境是”单线程”(sin ...

随机推荐

  1. nginx安装及配置文件详解

    一)nginx安装及模块讲解 1.1.nginx安装步骤 mkdir /soft wget http://nginx.org/download/nginx-1.12.0.tar.gz tar zxf ...

  2. OpenStack 安装数据库和rabbitmq消息队列 (三)

    一)安装配置数据库 1.1.安装包 # yum install mariadb mariadb-server python2-PyMySQL -y 1.2.配置数据库 # vim /etc/my.cn ...

  3. 【剑指offer】面试题 10. 斐波那契数列

    面试题 10. 斐波那契数列 题目一:求斐波那契数列的第n项 题目描述:求斐波拉契数列的第n项 写出一个函数,输入n,求斐波拉契(Fibonacci)数列的第n项.斐波拉契数列定义如下: C++ 实现 ...

  4. CF1020B Badge 【模拟链表】

    n个点(n<=1000) 接下来n个整数表示ai 第i个数ai表示i到ai有一条边 输出: n个数 表示从第i个点出发,最先被访问两次的点 样例1: 从1 出发,先到达2,2会到达3,3又到达2 ...

  5. 树形DP题目集合

    [树形DP](https://cn.vjudge.net/contest/123963#overview) #include<cstdio> #include<string> ...

  6. 如何上传word

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha word图片上传控件 word 图片 上传

  7. 【模拟】 Codeforces Round #434 (Div. 1, based on Technocup 2018 Elimination Round 1) C. Tests Renumeration

    题意:有一堆数据,某些是样例数据(假设X个),某些是大数据(假设Y个),但这些数据文件的命名非常混乱.要你给它们一个一个地重命名,保证任意时刻没有重名文件的前提之下,使得样例数据命名为1~X,大数据命 ...

  8. Nginx简单认识

    写在前面: 最近一直在学习,这几天了解了下Nginx,虽然看了些资料,斌哥也讲解了一下,但是貌似缺少了实践,就显得对其认识的不那么深刻.这里也还是简单的记录下把. 什么是Nginx? Nginx (e ...

  9. php应用数据库连接中的单例模式

    所谓的单例模式简而言之就是某个类在运行过程中只有一个实例,并且能够自行实例化并为整个系统的运行提供这个实例.在数据库连接中使用单例模式实例化数据库连接对象主要是可以避免重复的实例化对象而造成资源的浪费 ...

  10. Atlassian发布JIRA项目组合管理解决方案

    在其年度用户峰会上,开发和协作软件供应商Atlassian发布了JIRA Portfolio,JIRA Portfolio是JIRA的一个附加组件"可以提供简单准确的视图用于计划和管理跨团队 ...