Promise扫盲贴


Posted in Javascript onJune 24, 2019

then

then函数可以return另一个promise:

const p1 = new Promise((resolve, reject) =>{
  resolve('p1')
})
const p2 = new Promise((resolve, reject) =>{
 setTimeout(() =>{
  resolve('p2')
 },3000)
})
p1.then(res => {
 console.log(res)
  return p2
}).then(res =>{ 
  // p2 resolve后才执行
  console.log(res)
})
//p1
// 3s后输出...
// p2

那么这个p2就会代替当前p1的状态,等到新的p2的状态修改时,下一个then才会执行

catch

1. 作用

可以捕获到promise程序执行中的error,等同于  .then(null, rejection)  或  .then(undefined, rejection)

2. 可以获取到的错误

promise函数体中抛出的error。在promise resolve后,再抛出错误,不会被捕获

const p1 = new Promise((resolve,reject) => {throw new Error('error')})
p1.catch(error => console.log(error))  // Error: error

promise的reject操作

const p2 = new Promise((resolve,reject) => reject('rejected'))
p2.catch(error => console.log(error)) // rejected

then 函数体中抛出的error

const p3 = new Promise((resolve,reject) => resolve('resolved'))
p3.then(res =>{
  throw new Error('error')
}).catch(error => console.log(error)) // Error: error

then函数可以返回一个promise(如果没有定义catch方法),如果这个promise函数体中有reject或者error,也可以捕获到

3. 推荐使用catch方式捕获错误,而不是then的第二个参数:

因为catch可以捕获到它前面所有then方法中的错误

finally

  • 不管promise最后状态如何,都会执行的操作
  • 没有参数,获取不到当前promise最后的状态

Promise.all

1. 参数

参数不仅仅可以是数组,具有Iterator接口的对象都可以。
数组参数的每一个元素为promise实例,如果不是,就会调用Promise.resolve转换为Promise实例

const obj = {
  [Symbol.iterator]() {
    let index = 0
    return {
      next() {
        return {
          // promise对象 和 其他类型都可以
          value: new Promise(resolve => resolve(index++)), done: index > 2
          // value: index++, done: index > 2
        }
      }
    }
  }
}
const p = Promise.all(obj)
p.then(res => {
  console.log(res) // [0, 1]
})

2. 状态

const p = Promise.all([p1, p2, p3]);

p的状态由p1、p2、p3决定,分成两种情况:

  • 只有p1、p2、p3的状态都变成fulfilled,p的状态才会变成fulfilled,此时p1、p2、p3的返回值组成一个数组,传递给p的回调函数。
  • 只要p1、p2、p3之中有一个被rejected,p的状态就变成rejected,此时第一个被reject的实例的返回值,会传递给p的回调函数。

3. catch

如果参数中的promise定义了catch方法,那么Promise.all()的catch就不会捕获到错误

Promise.race

  • 只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变。那个率先改变的 Promise 实例的返回值,就传递给p的回调函数。
  • 参数、catch规则同Promise.all

Promise.resolve

将现有对象转为Promise对象。

1. 参数

  • 参数为promise实例:原封不动的返回这个实例。
  • 参数为thenable对象:将它转为promise对象,然后立即执行它的then方法
  • 参数不是thenable对象,或者是一个原始值:返回一个新的promise对象,状态为resolved
  • 没有参数:直接返回衣蛾resolved状态的promise对象

Promise.reject

返回一个状态为rejected的promise实例

Promise.reject()方法的参数,会原封不动地作为reject的理由,变成后续方法的参数

const thenable = {
 then(resolve, reject) {
  reject('error');
 }
};

Promise.reject(thenable)
.catch(e => {
 console.log(e === thenable)
})
// true e并不是'error'

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

Javascript 相关文章推荐
javascript实现面向对象类的功能书写技巧
Mar 07 Javascript
深入理解JavaScript系列(14) 作用域链介绍(Scope Chain)
Apr 12 Javascript
JS获取地址栏参数的几种方法小结
Feb 28 Javascript
JavaScript中的Math.sin()方法使用详解
Jun 15 Javascript
Angular2使用Guard和Resolve进行验证和权限控制
Apr 24 Javascript
实现微信小程序的wxml文件和wxss文件在webstrom的支持
Jun 12 Javascript
JavaScript之Canvas_动力节点Java学院整理
Jul 04 Javascript
vue页面使用阿里oss上传功能的实例(二)
Aug 09 Javascript
写给小白看的JavaScript异步
Nov 29 Javascript
JS实现模糊查询带下拉匹配效果
Jun 21 Javascript
微信小程序之 catalog 切换实现解析
Sep 12 Javascript
Js逆向实现滑动验证码图片还原的示例代码
Mar 10 Javascript
深入学习js函数的隐式参数 arguments 和 this
Jun 24 #Javascript
前端天气插件tpwidget使用方法详解
Jun 24 #Javascript
JavaScript深入V8引擎以及编写优化代码的5个技巧
Jun 24 #Javascript
JS实现给数组对象排序的方法分析
Jun 24 #Javascript
新手快速入门JavaScript装饰者模式与AOP
Jun 24 #Javascript
Electron + vue 打包桌面操作流程详解
Jun 24 #Javascript
JS字符串常用操作方法实例小结
Jun 24 #Javascript
You might like
基于PHP与XML的PDF文档生成技术
2006/10/09 PHP
coreseek 搜索英文的问题详解
2013/06/08 PHP
php中使用array_filter()函数过滤空数组的实现代码
2014/08/19 PHP
Zend Framework教程之MVC框架的Controller用法分析
2016/03/07 PHP
PHP访问数据库集群的方法小结
2016/03/14 PHP
PHP使用http_build_query()构造URL字符串的方法
2016/04/02 PHP
一键生成各种尺寸Icon的php脚本(实例)
2017/02/08 PHP
PHP实现二叉树深度优先遍历(前序、中序、后序)和广度优先遍历(层次)实例详解
2018/04/20 PHP
JQuery EasyUI 日期控件如何控制日期选择区间
2014/05/05 Javascript
js数值计算时使用parseInt进行数据类型转换(jquery)
2014/10/07 Javascript
javascript中定义类的方法汇总
2014/12/28 Javascript
基于Node.js的WebSocket通信实现
2017/03/11 Javascript
详解vue2.0组件通信各种情况总结与实例分析
2017/03/22 Javascript
selenium 与 chrome 进行qq登录并发邮件操作实例详解
2017/04/06 Javascript
NodeJS使用Range请求实现下载功能的方法示例
2018/10/12 NodeJs
微信小程序页面上下滚动效果
2020/11/18 Javascript
JS实现随机抽取三人
2019/11/06 Javascript
基于jsbarcode 生成条形码并将生成的条码保存至本地+源码
2020/04/27 Javascript
基于Python Numpy的数组array和矩阵matrix详解
2018/04/04 Python
PyQt5每天必学之拖放事件
2020/08/27 Python
Python3中configparser模块读写ini文件并解析配置的用法详解
2020/02/18 Python
python selenium操作cookie的实现
2020/03/18 Python
通过python-pptx模块操作ppt文件的方法
2020/12/26 Python
一款纯css3实现的响应式导航
2014/10/31 HTML / CSS
美国最流行的男士时尚网站:Touch of Modern
2018/02/05 全球购物
CHARLES & KEITH加拿大官网:新加坡时尚品牌
2020/03/26 全球购物
审核会计岗位职责
2013/11/08 职场文书
法学专业毕业生自荐信范文
2013/12/18 职场文书
一年级语文下册复习计划
2015/01/17 职场文书
社区端午节活动总结
2015/02/11 职场文书
辩护词范文大全
2015/05/21 职场文书
环保主题班会教案
2015/08/13 职场文书
热爱劳动主题班会
2015/08/14 职场文书
深入详解JS函数的柯里化
2021/06/09 Javascript
Go语言应该什么情况使用指针
2021/07/25 Golang
Python Pandas数据分析之iloc和loc的用法详解
2021/11/11 Python