Typescripts: Promise
作者:EER
链接:https://juejin.cn/post/6844903728399532039
来源:掘金
Promise
表示一个异步操作的最终结果,与之进行交付的方式主要是then
方法,该方法注册了两个回调函数,用于接收promise
的终值或本promise
不能执行的原因
Promises/A+(规范)
Promise
一个拥有then
方法的对象或函数,其行为符合Promises/A+
规范;thenable
一个定义了then
方法的对象或函数,也可视作 “拥有then
方法”值(value)
指任何 JavaScript 的合法值(包括 undefined , thenable 和 promise)异常(exception)
使用throw
语句抛出的一个值据因(reason)
表示一个 promise 的拒绝原因
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-OsG2gyE7-1646576514323)(https://user-gold-cdn.xitu.io/2018/11/30/167641e2a5e8b1b4?imageView2/0/w/1280/h/960/format/webp/ignore-error/1)]
Promises的状态
一个
Promise
的当前状态必须为以下三种状态中的一种:等状态(pending)、执行状态(fulfilled)、拒绝态(rejected)
- 等待态(Pending)
- 处于等待态时,promise 需满足:
可以
迁移至执行态或拒绝态
- 处于等待态时,promise 需满足:
- 执行态(Fulfilled)
- 处于执行态时,promise 需满足:
不能
迁移至其他任何状态,必须拥有一个不可变
的终值
- 处于执行态时,promise 需满足:
- 拒绝态(Rejected)
- 处于拒绝态时,promise 需满足:
不能
迁移至其他任何状态,必须拥有一个不可变
的据因
- 处于拒绝态时,promise 需满足:
Then 方法
一个
promise
必须提供一个then
方法以访问当前值、终值和据因
promise
的 then
方法接受两个参数:
promise.then(onFulfilled, onRejected);
-
onFulfilled
和onRejected
都是可选参数。 -
如果
onFulfilled
是函数,当 promise 执行结束后其必须被调用,其第一个参数为 promise 的终值,在 promise 执行结束前其不可被调用,其调用次数不可超过一次 -
如果
onRejected
是函数,当 promise 被拒绝执行后其必须被调用,其第一个参数为 promise 的据因,在 promise 被拒绝执行前其不可被调用,其调用次数不可超过一次 -
onFulfilled
和onRejected
必须被作为函数调用即没有 this 值 ( 也就是说在 严格模式(strict) 中,函数 this 的值为 undefined ;在非严格模式中其为全局对象。) -
then 方法可以被同一个 promise 调用多次
-
then 方法必须返回一个 promise 对象
大致的过程是,promise 会从 pending
转为 fulfilled
或 rejected
,然后对应调用 then
方法参数的 onFulfilled
或 onRejected
,最终返回 promise
对象。
进一步理解,假定 有如下两个 promise:
promise2 = promise1.then(onFulfilled, onRejected);
会有以下几种情况:
- 如果
onFulfilled
或者onRejected
抛出异常 e ,则 promise2 必须拒绝执行,并返回拒因 e
- 如果
onFulfilled
不是函数 且 promise1 成功执行, promise2 必须成功执行并返回 相同的值 - 如果
onRejected
不是函数 且 promise1 拒绝执行, promise2 必须拒绝执行并返回 相同的据因
Promise 实现
Promise
本身是一个构造函数,即可以实现为类
[[Resolve]]
方法
一般像 [[...]]
这样的认为是内部实现,如 [[Resolve]]
,该方法接受两个参数:
[[Resolve]](promise, x);
复制代码
对于 x
值,有以下几种情况:
x
有 then 方法 且看上去像一个Promise
x
为对象或函数x
为Promise
声明文件
TypeScript
中声明文件用于外部模块,是 TypeScript
的核心部分
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XDA307cA-1646576514324)(https://user-gold-cdn.xitu.io/2018/11/30/167641e35724b598?imageView2/0/w/1280/h/960/format/webp/ignore-error/1)]
Then 方法实现
声明文件用于外部模块,是 TypeScript
的核心部分
[外链图片转存中…(img-XDA307cA-1646576514324)]
Then 方法实现
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Iv4nRg7X-1646576514324)(https://user-gold-cdn.xitu.io/2018/11/30/167641e3c6b262a8?imageView2/0/w/1280/h/960/format/webp/ignore-error/1)]