手写 Promise（1）核心功能的实现

一：什么是 Promise

        Promise 是异步编程的一种解决方案，其实是一个构造函数，自己身上有all、reject、resolve这几个方法，原型上有then、catch等方法。    

Promise对象有以下两个特点。

（1）对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是Promise这个名字的由来，它的英语意思就是“承诺”，表示其他手段无法改变。

（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果，这时就称为 resolved（已定型）。如果改变已经发生了，你再对Promise对象添加回调函数，也会立即得到这个结果。这与事件（Event）完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。

二：手写Promise

1、手写构造函数

设计思路

• 定义类
• 添加构造函数
• 定义resolve/reject
• 执行回调函数

代码实现 

运行效果

2、手写状态及原因

设计思路

• 添加状态
• 添加原因
• 调整resolve/reject
• 状态不可逆

代码实现

运行效果

3、then方法--成功和失败的回调

设计思路

• 添加实例方法
• 参数判断
• 执行成功/失败回调

代码实现

运行效果

4、then方法--异步和多次调用

设计思路

• 定义实例属性
• 保存回调函数
• 调用成功/失败回调函数

代码实现

运行效果

5、异步任务

api介绍：

• 使用api：queueMicrotask、MutationObserve、setTimeout
• queueMicrotask：内置的全局函数，直接queueMicrotask() 就可以调用
• MutationObserve：内置的全局函数，比较麻烦，需要创建节点，具体看代码
• setTimeout：内置的全局函数，定时器

设计思路

• 定义函数
• 调用核心api
• 调用函数

代码实现

运行效果

6、链式编程

设计思路

• 返回Promise实例
• 获取返回值
• 处理返回值
  • 处理异常
  • 处理返回Promise（调用then方法）
  • 处理重复引用（抛出异常）

代码实现

运行效果

        这个运行效果是只测了一个，有兴趣的小伙伴可以吧代码复制下来自己测。

三：总结

        截止到目前为止已经将 Promise 的核心功能实现了，还有实例方法和静态方法这些没有实现。由于篇幅过长，因此会拆分成两篇文章来完成，感觉本文还不错的小伙伴可以继续看下一篇哦！