每天3分钟,重学ES6-ES12(十)Promise参数实例方法介绍(二)

简介: 每天3分钟,重学ES6-ES12(十)Promise参数实例方法介绍

Promise有哪些实例方法

console.log(Object.getOwnPropertyDescriptors(Promise.prototype))

1686836326661.jpg

then方法

接受两个参数

  • then方法是Promise对象上的一个方法:它其实是放在Promise的原型上的 Promise.prototype.then
  • then方法接受两个参数:
  • fulfilled的回调函数:当状态变成fulfilled时会回调的函数;
  • reject的回调函数:当状态变成reject时会回调的函数;

多次调用

  • 一个Promise的then方法是可以被多次调用的:
  • 每次调用我们都可以传入对应的fulfilled回调;
  • 当Promise的状态变成fulfilled的时候,这些回调函数都会被执行;

返回值

  • then方法本身是有返回值的,它的返回值是一个Promise,所以我们可以进行如下的链式调用:
  • 但是then方法返回的Promise到底处于什么样的状态呢?
  • Promise有三种状态,那么这个Promise处于什么状态呢?
  • 当then方法中的回调函数本身在执行的时候,那么它处于pending状态;
  • 当then方法中的回调函数返回一个结果时,那么它处于fulfilled状态,并且会将结果作为resolve的参数;
  • 情况一:返回一个普通的值;
  • 情况二:返回一个Promise;
  • 情况三:返回一个thenable值;
  • 当then方法抛出一个异常时,那么它处于reject状态;

catch方法

多次调用

  • catch方法也是Promise对象上的一个方法:它也是放在Promise的原型上的Promise.prototype.catch
  • 一个Promise的catch方法是可以被多次调用的:
  • 每次调用我们都可以传入对应的reject回调;
  • 当Promise的状态变成reject的时候,这些回调函数都会被执行;

返回值

  • 事实上catch方法也是会返回一个Promise对象的,所以catch方法后面我们可以继续调用then方法或者catch方法:
  • 下面的代码,后续是catch中的err2打印,还是then中的res打印呢?
  • 答案是res打印,这是因为catch传入的回调在执行完后,默认状态依然会是fulfilled的;
const promise = new Promise((resolve, reject) => {
  reject("111111")
})
promise.catch(err => {
  console.log("err1:", err)
}).catch(err2 => {
  console.log("err2:", err2)
}).then(res => {
  console.log("res result:", res)
})
// err1: 111111
// res result: undefined
  • 那么如果我们希望后续继续执行catch,那么需要抛出一个异常:
const promise = new Promise((resolve, reject) => {
  reject("111111")
})
promise.then(res => {
  console.log("res:", res)
}).catch(err => {
  console.log("err:", err)
  throw new Error("catch return value")
}).then(res => {
  console.log("res result:", res)
}).catch(err => {
  console.log("err result:", err)
})
// err: 111111
// err result: Error: catch return value

finally方法

  • finally是在ES9(ES2018)中新增的一个特性:表示无论Promise对象无论变成fulfilled还是reject状态,最终都会 被执行的代码。
  • finally方法是不接收参数的,因为无论前面是fulfilled状态,还是reject状态,它都会执行。

代码演示

const promise = new Promise((resolve, reject) => {
  // resolve("resolve message")
  reject("reject message")
})
promise.then(res => {
  console.log("res:", res)
}).catch(err => {
  console.log("err:", err)
}).finally(() => {
  console.log("finally code execute")
})




相关文章
Promise.all() 方法的参数可以是什么类型?
综上所述,`Promise.all()` 方法的参数类型较为灵活,但无论使用哪种类型的可迭代对象作为参数,其核心的异步操作处理逻辑和成功失败的判断机制都是一致的,都是为了方便地处理多个异步操作的并发执行和结果汇总。
Promise.all() 方法的参数可以是哪些数据类型?
`Promise.all()` 方法的参数具有很大的灵活性,可以适应多种不同的场景和需求,方便地处理多个异步操作的并发执行和结果汇总。
`Promise.all()`方法在处理数组形式参数时的执行机制
Promise.all()` 提供了一种方便的方式来同时处理多个异步操作,并在它们都完成后获取到所有的结果,使得我们能够更高效地进行异步任务的组合和处理。
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(五)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(五)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(六)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(六)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(四)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(四)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(三)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(三)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(二)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(二)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(一)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map
每天3分钟,重学ES6-ES12(十一)Promise的类方法
每天3分钟,重学ES6-ES12(十一)Promise的类方法
102 0

热门文章

最新文章

AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等