详解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 相关文章推荐
jquery 将disabled的元素置为enabled的三种方法
Jul 25 Javascript
js 获取浏览器高度和宽度值(多浏览器)
Sep 02 Javascript
Ext grid 添加右击菜单
Nov 26 Javascript
基于jquery的下拉框改变动态添加和删除表格实现代码
Sep 12 Javascript
文本框获得焦点和失去焦点的判断代码
Mar 18 Javascript
jquery获取选中的文本和值的方法
Jul 08 Javascript
在小程序开发中使用npm的方法
Oct 17 Javascript
微信小程序按钮点击跳转页面详解
May 06 Javascript
jquery 回调操作实例分析【回调成功与回调失败的情况】
Sep 27 jQuery
jQuery 淡入/淡出效果函数用法分析
May 19 jQuery
微信小程序调用后台service教程详解
Nov 06 Javascript
Java无向树分析 实现最小高度树
Apr 09 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中的ini配置原理详解
2014/10/14 PHP
PHP版本如何选择?应该使用哪个版本?
2015/05/13 PHP
使用ExtJS技术实现的拖动树结点
2010/08/05 Javascript
JavaScript高级程序设计 XML、Ajax 学习笔记
2011/09/10 Javascript
Extjs4中Form的使用之本地hiddenfield
2013/11/26 Javascript
JavaScript实现的伸展收缩型菜单代码
2015/10/14 Javascript
浅谈Angularjs link和compile的使用区别
2016/10/21 Javascript
JavaScript实现设置默认日期范围为最近40天的方法分析
2017/07/12 Javascript
实现一个完整的Node.js RESTful API的示例
2017/09/29 Javascript
jQuery ajax调用webservice注意事项
2017/10/08 jQuery
学习Vue组件实例
2018/04/28 Javascript
jQuery实现鼠标移入移出事件切换功能示例
2018/09/06 jQuery
Vue中用props给data赋初始值遇到的问题解决
2018/11/27 Javascript
使用vue-cli3新建一个项目并写好基本配置(推荐)
2019/04/24 Javascript
Vue SPA 初次进入加载动画实现代码
2019/11/14 Javascript
js实现图片上传到服务器和回显
2020/01/19 Javascript
vue接通后端api以及部署到服务器操作
2020/08/13 Javascript
[50:48]LGD vs CHAOS 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
python3编写C/S网络程序实例教程
2014/08/25 Python
Python中SOAP项目的介绍及其在web开发中的应用
2015/04/14 Python
Python3.2中的字符串函数学习总结
2015/04/23 Python
python定时利用QQ邮件发送天气预报的实例
2017/11/17 Python
Python实现基于KNN算法的笔迹识别功能详解
2018/07/09 Python
python实现通过队列完成进程间的多任务功能示例
2019/10/28 Python
最新PyCharm 2020.2.3永久激活码(亲测有效)
2020/11/26 Python
HTML5中的强制下载属性download使用实例解析
2016/05/12 HTML / CSS
在线购买澳大利亚设计师手拿包和奢华晚装手袋:Olga Berg
2019/03/20 全球购物
罗马尼亚购物网站:Vivantis.ro
2019/07/20 全球购物
上班上网检讨书
2014/01/29 职场文书
社区国庆节活动方案
2014/02/05 职场文书
网络信息安全承诺书
2014/03/26 职场文书
爱心活动计划书
2014/04/26 职场文书
项目战略合作意向书
2015/05/08 职场文书
在校生证明
2015/06/17 职场文书
委托书范本格式
2019/04/18 职场文书
导游词之台湾阿里山
2019/10/23 职场文书