详解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中使用sort结合localeCompare实现中文排序实例
Jul 23 Javascript
moment.js轻松实现获取当前日期是当年的第几周
Feb 05 Javascript
js改变透明度实现轮播图的算法
Aug 24 Javascript
domReady的实现案例
Nov 23 Javascript
Bootstrap源码解读模态弹出框(11)
Dec 28 Javascript
jQuery操作css样式
May 15 jQuery
vue.js获取数据库数据实例代码
May 26 Javascript
Webpack 之 babel-loader文件预处理器详解
Mar 23 Javascript
基于jQuery实现Ajax验证用户名是否可用实例
Mar 25 jQuery
微信小程序显示倒计时功能示例【测试可用】
Dec 03 Javascript
vue实现移动端轻量日期组件不依赖第三方库的方法
Apr 28 Javascript
vue+element实现打印页面功能
May 20 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 处理图片的类实现代码
2009/10/23 PHP
怎样给PHP源代码加密?PHP二进制加密与解密的解决办法
2013/04/22 PHP
php结合ajax实现赞、顶、踩功能实例
2014/05/12 PHP
PHP使用feof()函数读文件的方法
2014/11/07 PHP
thinkphp的静态缓存用法分析
2014/11/29 PHP
php结合web uploader插件实现分片上传文件
2016/05/10 PHP
PHP上传图片到数据库并显示的实例代码
2019/12/20 PHP
PHP设计模式(六)桥连模式Bridge实例详解【结构型】
2020/05/02 PHP
Dom加载让图片加载完再执行的脚本代码
2008/05/15 Javascript
javascript实现的在当前窗口中漂浮框的代码
2010/03/15 Javascript
artDialog双击会关闭对话框的修改过程分享
2013/08/05 Javascript
AngularJS实现Model缓存的方式
2016/02/03 Javascript
javascript稀疏数组(sparse array)和密集数组用法分析
2016/12/28 Javascript
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例
2017/08/04 jQuery
Bootstrap Tooltip显示换行和左对齐的解决方案
2017/10/11 Javascript
vue+socket.io+express+mongodb 实现简易多房间在线群聊示例
2017/10/21 Javascript
详解webpack之scss和postcss-loader的配置
2018/01/09 Javascript
关于vue中的ajax请求和axios包问题
2018/04/19 Javascript
webpack分离css单独打包的方法
2018/06/12 Javascript
vue实现form表单与table表格的数据关联功能示例
2019/01/29 Javascript
详解使用Nuxt.js快速搭建服务端渲染(SSR)应用
2019/03/13 Javascript
详解JavaScript中精度失准问题及解决方法
2020/02/04 Javascript
使用Python内置的模块与函数进行不同进制的数的转换
2016/03/12 Python
python中实现数组和列表读取一列的方法
2018/04/03 Python
详解python 破解网站反爬虫的两种简单方法
2020/02/09 Python
python 自定义异常和主动抛出异常(raise)的操作
2020/12/11 Python
俄语专业毕业生推荐信
2013/10/28 职场文书
新娘父亲婚礼致辞
2014/01/16 职场文书
后进生转化工作制度
2014/01/17 职场文书
高中生物教学反思
2014/02/05 职场文书
销售助理岗位职责
2014/02/21 职场文书
风险评估实施方案
2014/03/09 职场文书
干部选拔任用方案
2014/05/26 职场文书
意向书范本
2014/07/29 职场文书
2014年政协委员工作总结
2014/12/01 职场文书
2015学习委员工作总结范文
2015/04/03 职场文书