每天3分钟,重学ES6-ES12(十一)Promise的类方法

简介: 每天3分钟,重学ES6-ES12(十一)Promise的类方法

19c2e7a9bfbb7f5e8c7d744db995e29.png

每天3分钟,重学ES6-ES12文章汇总

前言

今天开始和大家一起系统的学习ES6+,每天3分钟,用一把斗地主的时间,重学ES6+,前面我们学习的then、catch、finally方法都属于Promise的实例方法,都是存放在Promise的prototype上的。 下面我们再来学习一下Promise的类方法。

resolve方法

  • 有时候我们已经有一个现成的内容了,希望将其转成Promise来使用,这个时候我们可以使用 Promise.resolve 方法来完成。
  • Promise.resolve的用法相当于new Promise,并且执行resolve操作:Promise.resolve('a')

等价于

new Promise((resolve)=>resolve('a'))

  • resolve参数的形态:
  • 情况一:参数是一个普通的值或者对象
  • 情况二:参数本身是Promise
  • 情况三:参数是一个thenable

reject方法

  • reject方法类似于resolve方法,只是会将Promise对象的状态设置为reject状态。
  • Promise.reject的用法相当于new Promise,只是会调用reject:Promise.reject('a')

等价于

new Promise((resolve,rejext)=>reject('a'))

  • Promise.reject传入的参数无论是什么形态,都会直接作为reject状态的参数传递到catch的。

all方法

  • 它的作用是将多个Promise包裹在一起形成一个新的Promise;
  • 新的Promise状态由包裹的所有Promise共同决定:
  • 当所有的Promise状态变成fulfilled状态时,新的Promise状态为fulfilled,并且会将所有Promise的返回值 组成一个数组;
  • 当有一个Promise状态为reject时,新的Promise状态为reject,并且会将第一个reject的返回值作为参数;

allSettled方法

  • all方法有一个缺陷:当有其中一个Promise变成reject状态时,新Promise就会立即变成对应的reject状态。
  • 那么对于resolved的,以及依然处于pending状态的Promise,我们是获取不到对应的结果的;
  • ES11(ES2020)中,添加了新的API Promise.allSettled:
  • 该方法会在所有的Promise都有结果(settled),无论是fulfilled,还是reject时,才会有最终的状态;
  • 并且这个Promise的结果一定是fulfilled的;
  • allSettled的结果是一个数组,数组中存放着每一个Promise的结果,并且是对应一个对象的;
  • 这个对象中包含status状态,以及对应的value值;

代码演示

// 创建多个Promise
const p1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(11111)
  }, 1000);
})
const p2 = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject(22222)
  }, 2000);
})
const p3 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(33333)
  }, 3000);
})
// allSettled
Promise.allSettled([p1, p2, p3]).then(res => {
  console.log(res)
}).catch(err => {
  console.log(err)
})
//[{status: 'fulfilled', value: 11111}, 
//{status: 'rejected', reason: 22222},
//{status: 'fulfilled', value: 33333}]

race方法

  • 如果有一个Promise有了结果,我们就希望决定最终新Promise的状态,那么可以使用race方法:
  • race是竞技、竞赛的意思,表示多个Promise相互竞争,谁先有结果,那么就使用谁的结果;

any方法

  • any方法是ES12中新增的方法,和race方法是类似的:
  • any方法会等到一个fulfilled状态,才会决定新Promise的状态;
  • 如果所有的Promise都是reject的,那么也会等到所有的Promise都变成rejected状态;
  • 如果所有的Promise都是reject的,那么会报一个AggregateError的错误。

总结

Promise在面试中,属于经常会问的知识,但是很少让手写promise的原理,因为时间不允许,但是手写promise源码是最能考察基本功的,所以大多是面试题都变成了,考察promsie的类方法,手写一个类方法的实现。之后有精力也会和大家分享类方法的实现。


相关文章
|
9月前
|
前端开发
62 # 借用 promise 写成类的方法
62 # 借用 promise 写成类的方法
20 0
|
前端开发
每天3分钟,重学ES6-ES12(十)Promise参数实例方法介绍(二)
每天3分钟,重学ES6-ES12(十)Promise参数实例方法介绍
55 0
|
前端开发
每天3分钟,重学ES6-ES12(十)Promise参数实例方法介绍(一)
每天3分钟,重学ES6-ES12(十)Promise参数实例方法介绍
37 0
|
前端开发 API
每天3分钟,重学ES6-ES12(九)Promise简单介绍
每天3分钟,重学ES6-ES12(九)Promise简单介绍
60 0
|
前端开发 开发者
剖析Promise内部结构,一步一步实现一个完整的、能通过所有Test case的Promise类
本文写给有一定Promise使用经验的人,如果你还没有使用过Promise,这篇文章可能不适合你,建议先了解Promise的使用 Promise标准解读 1.
744 0
|
2月前
|
前端开发 JavaScript
如何处理 JavaScript 中的异步操作和 Promise?
如何处理 JavaScript 中的异步操作和 Promise?
26 1
|
2月前
|
前端开发 JavaScript
在JavaScript中,什么是promise、怎么使用promise、怎么手写promise
在JavaScript中,什么是promise、怎么使用promise、怎么手写promise
40 4
|
2月前
|
前端开发 JavaScript 开发者
JavaScript 中的异步编程:Promise 和 Async/Await
在现代的 JavaScript 开发中,异步编程是至关重要的。本文将介绍 JavaScript 中的异步编程概念,重点讨论 Promise 和 Async/Await 这两种常见的处理异步操作的方法。通过本文的阐述,读者将能够更好地理解和应用这些技术,提高自己在 JavaScript 开发中处理异步任务的能力。
|
17天前
|
前端开发 JavaScript 开发者
JavaScript进阶-Promise与异步编程
【6月更文挑战第20天】JavaScript的Promise简化了异步操作,从ES6开始成为标准。Promise有三种状态:pending、fulfilled和rejected。基本用法涉及构造函数和`.then`处理结果,如: ```javascript new Promise((resolve, reject) => { setTimeout(resolve, 2000, '成功'); }).then(console.log); // 输出: 成功
|
2月前
|
JSON 前端开发 JavaScript
【JavaScript技术专栏】JavaScript异步编程:Promise、async/await解析
【4月更文挑战第30天】JavaScript中的异步编程通过Promise和async/await来解决回调地狱问题。Promise代表可能完成或拒绝的异步操作,有pending、fulfilled和rejected三种状态。它支持链式调用和Promise.all()、Promise.race()等方法。async/await是ES8引入的语法糖,允许异步代码以同步风格编写,提高可读性和可维护性。两者结合使用能更高效地处理非阻塞操作。