什么是 Promise?
Promise 是处理异步操作的一种方式,它可以将异步操作封装成一个对象,通过回调函数的方式处理异步结果。Promise 有三种状态:pending(进行中)、fulfilled(已成功)和 rejected(已失败)。当 Promise 状态变成 fulfilled 或 rejected 时,称为 settled。
Promise 的使用
在 JavaScript 中,Promise 是一个构造函数,我们可以使用 new 运算符创建一个 Promise 实例:
const myPromise = new Promise((resolve, reject) => { // 异步操作 });
在 Promise 的构造函数中,需要传入一个函数,该函数接受两个参数:resolve 和 reject。resolve 函数用于将 Promise 的状态转为 fulfilled,reject 函数用于将 Promise 的状态转为 rejected。例如:
-- -------------------- ---- ------- ----- --------- - --- ----------------- ------- -- - ------------- -- - -------------- -- ------ --- --------------- ----- -- ------------------- -- ------- ------ -- --------------------- -- ------- --
上面的代码中,myPromise 的状态会在1秒后变为 fulfilled,并且执行了成功的回调函数。
Promise 的原理分析
Promise 的实现主要依赖于两个核心概念:状态和微任务。
状态
Promise 有三种状态:pending、fulfilled 和 rejected。状态只能从 pending 转换为 fulfilled 或 rejected,转换后就不可再更改状态。
微任务
微任务是异步执行的任务,它可以延迟到 JavaScript 主线程执行栈为空时再执行。Promise 的 then 和 catch 方法中的回调函数就是微任务。当 Promise 状态转换为 fulfilled 或 rejected 时,会将对应的微任务加入微任务队列,等待 JavaScript 主线程执行栈为空时执行。
Promise 原理实现
根据 Promise 的原理,我们可以手动实现一个 Promise:
-- -------------------- ---- ------- ----- --------- - --------------------- - ----------- - ---------- -- ----- ------- ---------- - ---------- -- ---------- --------- ----------- - ---------- -- --------- --------- ------------------------- - --- -- --------- ------------------------ - --- -- --------- ----- ------- - ----- -- - -- - ------- ---- --------- --- -- ------------ --- ---------- - ----------- - ------------ ---------- - ------ ------------------------------------ -- ------ -- ----------- - -- ----- ------ - ------ -- - -- - ------- ---- -------- --- -- ------------ --- ---------- - ----------- - ----------- ----------- - ------- ----------------------------------- -- ------ -- ----------- - -- --- - ----------------- -------- -- --------------- ------- - ------ -- - ----- ------- - -------------- -- -------- ------- ---- -------- - - ----------------- ----------- - ----------- - ------ ----------- --- ---------- - ----------- - ----- -- ------ ---------- - ------ ---------- --- ---------- - ---------- - ------ -- - ----- ------ -- ----- -------- - --- ------------------- ------- -- - -- ------------ --- ------------ - ------------- -- - -- --------------- --- - ----- - - ------------------------ ----------------------------- -- -------- -------- -- ----- - - ------- --- - ----- ------- - -------------- - -- --- - ---- -- ------------ --- ----------- - ------------- -- - -- --------------- --- - ----- - - ------------------------ ----------------------------- -- ------- - ----------------------------------------------------------- -------- ----------------------------------------------------------------------------------