前端面试手写 Promise：逐行破解面试难题
2023-12-11 10:38:56
掌握手写 Promise，解锁 JavaScript 并发编程
定义 Promise
Promise 是 JavaScript 中处理异步操作的强大工具。它允许我们推迟或等待操作的完成，并处理其结果或错误。在深入研究手写 Promise 之前，让我们快速回顾一下它的核心概念。
手写 Promise 的步骤
-
定义构造函数： 创建一个 Promise 构造函数，它接受一个 executor 函数作为参数。executor 函数有两个参数，resolve 和 reject，它们用于解决或拒绝 Promise。
-
实例化 Promise： 使用 new 实例化 Promise，并传入 executor 函数。
-
调用 resolve 或 reject： 在 executor 函数中，调用 resolve 或 reject 来解决或拒绝 Promise。resolve 用于传递成功的操作结果，而 reject 用于传递错误。
-
使用 then 或 catch： 在 Promise 实例上使用 then 或 catch 来处理 Promise 的结果或错误。
示例代码
下面是一个手写 Promise 的示例代码：
function myPromise(executor) {
let resolved = false;
let rejected = false;
let result;
let error;
function resolve(value) {
if (resolved || rejected) return;
resolved = true;
result = value;
}
function reject(err) {
if (resolved || rejected) return;
rejected = true;
error = err;
}
executor(resolve, reject);
return {
then: function (onFulfilled) {
if (resolved) {
onFulfilled(result);
} else {
setTimeout(() => {
onFulfilled(result);
}, 0);
}
},
catch: function (onRejected) {
if (rejected) {
onRejected(error);
} else {
setTimeout(() => {
onRejected(error);
}, 0);
}
}
};
}
内部机制
-
executor 函数： executor 函数是 Promise 的核心，它接收 resolve 和 reject 函数作为参数。当 Promise 实例化时，会立即执行此函数。
-
resolve 和 reject： resolve 和 reject 函数用于解决或拒绝 Promise。一旦调用 resolve 或 reject，Promise 将进入已解决状态。
-
then 和 catch： then 和 catch 是处理 Promise 结果或错误的链式方法。then 方法在 Promise 解决时调用，而 catch 方法在 Promise 拒绝时调用。
面试技巧
在面试中，展示手写 Promise 的能力时，请遵循以下技巧：
- 清楚解释 Promise 的定义和工作原理。
- 分步展示如何手写 Promise，包括定义构造函数、实例化 Promise 和处理结果。
- 强调 Promise 的异步特性，以及如何使用 then 或 catch 来处理异步操作。
- 提供示例代码以证明您的理解。
常见问题解答
-
为什么我们要手写 Promise？
手写 Promise 是一种理解 Promise 内部机制和异步编程概念的好方法。它还可以帮助您更好地理解 JavaScript 中的并发模型。 -
如何解决 Promise 链的问题？
使用 Promise.all() 方法可以解决 Promise 链的问题，它允许您等待所有 Promise 同时解决。 -
如何处理未处理的 Promise 拒绝？
使用 window.addEventListener('unhandledrejection') 事件监听器可以处理未处理的 Promise 拒绝。 -
什么是 Promise 微任务？
Promise 微任务是在 JavaScript 事件循环中比任务优先执行的特殊任务。它们用于处理 Promise 的解决和拒绝。 -
手写 Promise 有哪些优点和缺点？
优点： 理解 Promise 的内部机制，增强对异步编程的理解，自定义 Promise 行为。缺点： 代码更复杂，容易出错，在大型项目中管理可能很困难。
结论
掌握手写 Promise 是前端开发者的一项重要技能。通过理解其内部机制和手写步骤，您可以提升您的前端开发能力并自信应对面试中的手写 Promise 问题。不断练习并探索 Promise 的高级概念，例如 Promise chaining 和 error handling，将帮助您成为 JavaScript 并发编程的专家。
