Typescripts Promise

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 需满足：可以迁移至执行态或拒绝态
• 执行态（Fulfilled）
  • 处于执行态时，promise 需满足：不能迁移至其他任何状态，必须拥有一个不可变的终值
• 拒绝态（Rejected）
  • 处于拒绝态时，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);

会有以下几种情况：

1. 如果 onFulfilled 或者 onRejected 抛出异常 e ，则 promise2 必须拒绝执行，并返回 拒因 e
2. 如果 onFulfilled 不是函数 且 promise1 成功执行， promise2 必须成功执行并返回 相同的值
3. 如果 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)]