详解ES6 Promise对象then方法链式调用


Posted in Javascript onOctober 20, 2018

promise俗称链式调用,它是es6中最重要的特性之一

简单的说可以不停的then调用嵌套在调用(异步之后,链式调用方式执行回调),这种操作方式称为promise

then()方法的作用是Promise实例添加解决(fulfillment)和拒绝(rejection)状态的回调函数。then()方法会返回一个新的Promise实例,所以then()方法后面可以继续跟另一个then()方法进行链式调用。

let p = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'success');
});
p.then(
  res => {
    console.log(res);
    return `${res} again`;
  }
)
  .then(
    res => console.log(res)
  );
// 连续
// success
// success again

但是前一个then()方法中的回调函数中又可能返回一个Promise实例,这时候后面一个then()方法中的回调函数会等前一个Promise实例的状态发生变化才会调用。

let p = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'success');
});
p.then(
  res => {
    console.log(res);
    return new Promise((resolve, reject) => {
      setTimeout(resolve, 1000, 'success');
    });
  }
)
  .then(
    res => console.log(res)
  );
// 相隔1000ms
// success
// success

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
优秀js开源框架-jQuery使用手册(1)
Mar 10 Javascript
javascript GUID生成器实现代码
Oct 31 Javascript
Array, Array Constructor, for in loop, typeof, instanceOf
Sep 13 Javascript
js操作label给label赋值及取label的值示例
Nov 07 Javascript
ajax提交表单实现网页无刷新注册示例
May 08 Javascript
jquery $.trim()方法使用介绍
May 21 Javascript
详解JavaScript的流程控制语句
Nov 30 Javascript
AngularJS向后端ASP.NET API控制器上传文件
Feb 03 Javascript
js中使用使用原型(prototype)定义方法的好处详解
Jul 04 Javascript
ElementUI中el-tree节点的操作的实现
Feb 27 Javascript
在Vue里如何把网页的数据导出到Excel的方法
Sep 30 Javascript
JavaScript实现4位随机验证码的生成
Jan 28 Javascript
Intellij IDEA搭建vue-cli项目的方法步骤
Oct 20 #Javascript
分享5个小技巧让你写出更好的 JavaScript 条件语句
Oct 20 #Javascript
angular4 获取wifi列表中文显示乱码问题的解决
Oct 20 #Javascript
vue 项目地址去掉 #的方法
Oct 20 #Javascript
VUE-cli3使用 svg-sprite-loader
Oct 20 #Javascript
vuex2中使用mapGetters/mapActions报错的解决方法
Oct 20 #Javascript
Vue项目pdf(base64)转图片遇到的问题及解决方法
Oct 19 #Javascript
You might like
在php中取得image按钮传递的name值
2006/10/09 PHP
php微信公众平台开发之微信群发信息
2016/09/13 PHP
php简单统计中文个数的方法
2016/09/30 PHP
一个简单的弹性返回顶部JS代码实现介绍
2013/06/09 Javascript
JavaScript获取某年某月的最后一天附截图
2014/06/23 Javascript
javascritp添加url参数将参数加入到url中
2014/09/25 Javascript
Ajax局部更新导致JS事件重复触发问题的解决方法
2014/10/14 Javascript
Javascript 6里的4个新语法
2016/08/25 Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
2016/09/16 Javascript
Avalonjs 实现简单购物车功能(实例代码)
2017/02/07 Javascript
JavaScript手风琴页面制作
2017/05/17 Javascript
jQuery EasyUI 折叠面板accordion的使用实例(分享)
2017/12/25 jQuery
ExtJs整合Echarts的示例代码
2018/02/27 Javascript
vue-cli2打包前和打包后的css前缀不一致的问题解决
2018/08/24 Javascript
微信小程序模板template简单用法示例
2018/12/04 Javascript
小程序文字跑马灯效果
2018/12/28 Javascript
vue.js实现回到顶部动画效果
2019/07/31 Javascript
python的id()函数介绍
2013/02/10 Python
python切换hosts文件代码示例
2013/12/31 Python
利用QT写一个极简单的图形化Python闹钟程序
2015/04/07 Python
Python实现的破解字符串找茬游戏算法示例
2017/09/25 Python
Java及python正则表达式详解
2017/12/27 Python
python中set()函数简介及实例解析
2018/01/09 Python
python暴力解压rar加密文件过程详解
2019/07/05 Python
浅谈Python3 numpy.ptp()最大值与最小值的差
2019/08/24 Python
python中threading开启关闭线程操作
2020/05/02 Python
Born鞋子官网:Born Shoes
2017/04/06 全球购物
Funko官方商店:源自美国,畅销全球搪胶收藏玩偶
2018/09/15 全球购物
单位人事专员介绍信
2014/01/11 职场文书
企业承诺书怎么写
2014/05/24 职场文书
司法所长先进事迹
2014/06/02 职场文书
试用期解除劳动合同通知书
2015/04/16 职场文书
可可西里观后感
2015/06/08 职场文书
初中运动会闭幕词范本3篇
2019/12/09 职场文书
vue+iview实现手机号分段输入框
2022/03/25 Vue.js
SONY600GR,国产收音机厂商永远的痛
2022/04/05 无线电