详解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 相关文章推荐
浅析Node在构建超媒体API中的作用
Jul 30 Javascript
jQuery背景插件backstretch使用指南
Apr 21 Javascript
js图片轮播特效代码分享
Sep 07 Javascript
JS函数的几种定义方式分析
Dec 17 Javascript
javascript实现标签切换代码示例
May 22 Javascript
Bootstrap+jfinal实现省市级联下拉菜单
May 30 Javascript
JS常用知识点整理
Jan 21 Javascript
JavaScript 程序错误Cannot use 'in' operator to search的解决方法
Jul 10 Javascript
利用vscode调试编译后的js代码详解
May 14 Javascript
通过vue手动封装on、emit、off的代码详解
May 29 Javascript
JS中数据结构与算法---排序算法(Sort Algorithm)实例详解
Jun 17 Javascript
vue v-on:click传递动态参数的步骤
Sep 11 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空间不支持socket但支持curl时recaptcha的用法
2011/11/07 PHP
Symfony2框架创建项目与模板设置实例详解
2016/03/17 PHP
Laravel5权限管理方法详解
2016/07/26 PHP
PHP中Trait及其应用详解
2017/02/14 PHP
thinkphp分页集成实例
2017/07/24 PHP
文本链接逐个出现的js脚本
2007/12/12 Javascript
扩展javascript的Date方法实现代码(prototype)
2010/11/20 Javascript
基于Jquery实现的一个图片滚动切换
2012/06/21 Javascript
在JavaScript里嵌入大量字符串常量的实现方法
2013/07/07 Javascript
js的toLowerCase方法用法实例
2015/01/27 Javascript
JavaScript编程中的Promise使用大全
2015/07/28 Javascript
关于backbone url请求中参数带有中文存入数据库是乱码的快速解决办法
2016/06/13 Javascript
浅谈js中用$(#ID)来作为选择器的问题(id重复的时候)
2017/02/14 Javascript
Electron-vue脚手架改造vue项目的方法
2018/10/22 Javascript
微信小程序实现的canvas合成图片功能示例
2019/05/03 Javascript
Vue的路由及路由钩子函数的实现
2019/07/02 Javascript
TensorFlow.js 微信小程序插件开始支持模型缓存的方法
2020/02/21 Javascript
js屏蔽F12审查元素,禁止修改页面代码等实现代码
2020/10/02 Javascript
python 测试实现方法
2008/12/24 Python
Python中Collection的使用小技巧
2014/08/18 Python
Python连接mssql数据库编码问题解决方法
2015/01/01 Python
python3实现短网址和数字相互转换的方法
2015/04/28 Python
Python基于PycURL实现POST的方法
2015/07/25 Python
浅谈Python基础之I/O模型
2017/05/11 Python
对pycharm代码整体左移和右移缩进快捷键的介绍
2018/07/16 Python
Python和Java的语法对比分析语法简洁上python的确完美胜出
2019/05/10 Python
基于pycharm实现批量修改变量名
2020/06/02 Python
关于HTML5的22个初级技巧(图文教程)
2012/06/21 HTML / CSS
四年级科学教学反思
2014/02/10 职场文书
求职信内容怎么写
2014/05/26 职场文书
领导干部群众路线剖析材料
2014/10/09 职场文书
小英雄雨来观后感
2015/06/09 职场文书
老兵退伍感言
2015/08/03 职场文书
《大禹治水》教学反思
2016/02/22 职场文书
Python借助with语句实现代码段只执行有限次
2022/03/23 Python
MySQL创建管理HASH分区
2022/04/13 MySQL