JavaScript Promise 同步调用：阻塞行为分析
在 JavaScript 中，Promise 用于处理异步操作。然而，Promise 的同步调用，尤其是在 Promise 长期处于 pending 状态时，其行为可能会令人困惑。本文将探讨此场景下 JavaScript 代码的执行情况。
以下代码片段作为示例：
async function yyy() {
console.log('yyy 调用 xxx 开始');
let res = await xxx();
console.log('yyy 调用 xxx 结束', res);
}
async function xxx() {
return new Promise(function(resolve, reject) {
// 没有 resolve 或 reject 调用
});
}
在 yyy 函数中，await xxx() 会等待 xxx 函数返回的 Promise 完成。由于 xxx 函数返回的 Promise 既没有 resolve 也未 reject，它将永远处于 pending 状态。那么，yyy 函数会阻塞吗？答案取决于运行环境：
Node.js 环境
在 Node.js 环境中，如果 Promise 处于 pending 状态且没有其他异步操作（例如定时器、网络请求），Node.js 的事件循环将检测到没有待处理的任务，从而结束进程。 Node.js 的事件循环机制依赖于异步操作的完成，如果没有异步操作需要处理，事件循环将不会无限期等待 pending 的 Promise。
立即学习“Java免费学习笔记（深入）”；
浏览器环境
在浏览器环境中，await 将无限期等待 Promise 完成。然而，这并不一定意味着浏览器完全阻塞。 如果该脚本是页面加载的一部分，它可能不会阻止页面的渲染和用户交互。但如果脚本是在独立的上下文（例如，直接在 标签中或通过浏览器控制台执行），并且是同步执行的，那么在 await xxx() 之后代码将不会执行，直到 Promise 被 resolve 或 reject。
为了更清晰地说明，我们修改代码，模拟一个长时间运行的操作：
async function yyy() {
console.log('yyy 调用 xxx 开始');
let res = await xxx();
console.log('yyy 调用 xxx 结束', res);
}
async function xxx() {
return new Promise(function(resolve, reject) {
let startTime = Date.now();
while (true) {
let currentTime = Date.now();
if (currentTime - startTime > 1000) {
console.log('xxx 正在运行...');
startTime = currentTime;
}
}
});
}
yyy();
此代码中，xxx 函数包含一个无限循环，模拟长时间运行的任务。在浏览器环境中，yyy 函数将被阻塞，而 xxx 函数在后台运行，浏览器可能出现卡顿现象。
总结：Promise 的同步调用在 pending 状态下的阻塞行为取决于运行环境和代码执行上下文。 在 Node.js 中，事件循环不会无限期等待；而在浏览器环境中，await 会阻塞后续代码执行，但可能不会完全阻塞浏览器。 关键在于是否有其他异步操作来维持事件循环的运行。 为了避免阻塞，应确保 Promise 最终会 resolve 或 reject，或者使用更合适的异步编程模式。
