详解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 相关文章推荐
javascript Discuz代码中的msn聊天小功能
May 25 Javascript
常用一些Javascript判断函数
Aug 14 Javascript
js 表单提交后按钮变灰的实例代码
Aug 16 Javascript
利用a标签自动解析URL分析网址实例
Oct 20 Javascript
JavaScript中的Math.SQRT1_2属性使用简介
Jun 14 Javascript
jquery实现的代替传统checkbox样式插件
Jun 19 Javascript
bootstrap学习笔记之初识bootstrap
Jun 21 Javascript
终于实现了!精彩的jquery弹幕效果
Jul 18 Javascript
JavaScript常用正则函数用法示例
Jan 23 Javascript
微信、QQ、微博、Safari中使用js唤起App
Jan 24 Javascript
vue 的点击事件获取当前点击的元素方法
Sep 15 Javascript
JavaScript随机数的组合问题案例分析
May 16 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中协程和阻塞的一些理解与思考
2017/08/11 PHP
php工具型代码之印章抠图
2018/07/18 PHP
php框架知识点的整理和补充
2021/03/01 PHP
8个超棒的学习 jQuery 的网站 推荐收藏
2011/04/02 Javascript
mailto的使用技巧分享
2012/12/21 Javascript
JavaScript将相对地址转换为绝对地址示例代码
2013/07/19 Javascript
鼠标滚轮改变图片大小的示例代码
2013/11/20 Javascript
基于javascript实现浏览器滚动条快到底部时自动加载数据
2015/11/30 Javascript
微信小程序 数据交互与渲染实例详解
2017/01/21 Javascript
Nodejs高扩展性的模板引擎 functmpl简介
2017/02/13 NodeJs
vue组件中使用props传递数据的实例详解
2018/04/08 Javascript
微信小程序实现授权登录
2019/05/15 Javascript
js找出5个数中最大的一个数和倒数第二大的数实现方法示例小结
2020/03/04 Javascript
Vue2.0 $set()的正确使用详解
2020/07/28 Javascript
Webpack3+React16代码分割的实现
2021/03/03 Javascript
简介Python中用于处理字符串的center()方法
2015/05/18 Python
浅析Python 中整型对象存储的位置
2016/05/16 Python
python装饰器实例大详解
2017/10/25 Python
Python编程之基于概率论的分类方法:朴素贝叶斯
2017/11/11 Python
Python入门必须知道的11个知识点
2018/03/21 Python
pyqt5 comboBox获得下标、文本和事件选中函数的方法
2019/06/14 Python
Python3 文章标题关键字提取的例子
2019/08/26 Python
利用python实现凯撒密码加解密功能
2020/03/31 Python
pytorch加载自己的图像数据集实例
2020/07/07 Python
html5使用canvas画一条线
2014/12/15 HTML / CSS
使用phonegap克隆和删除联系人的实现方法
2017/03/31 HTML / CSS
Java中的基本数据类型所占存储空间大小固定的吗
2012/02/15 面试题
教师自我鉴定范文
2014/03/20 职场文书
投标担保书范文
2014/04/02 职场文书
广播节目策划方案
2014/05/23 职场文书
迎新生标语大全
2014/10/06 职场文书
整改通知书格式
2015/04/22 职场文书
幼儿教师三分钟演讲稿
2019/06/21 职场文书
详解Java ES多节点任务的高效分发与收集实现
2021/06/30 Java/Android
mybatis3中@SelectProvider传递参数方式
2021/08/04 Java/Android
java版 简单三子棋游戏
2022/05/04 Java/Android