本文详解为何在 promise 内部修改局部变量无法保留状态，并提供可传递、可返回的增量方案，通过参数传入与 resolve 返回实现跨异步调用的数值累加。
本文详解为何在 promise 内部修改局部变量无法保留状态，并提供可传递、可返回的增量方案，通过参数传入与 resolve 返回实现跨异步调用的数值累加。
在 JavaScript 异步编程中，一个常见误区是试图在 setTimeout 回调或 Promise 执行器内部直接修改外层函数的局部变量（如 loopVal++），并期望该修改能“延续”到下一次异步调用中。但事实上，每次调用 hi() 都会创建全新的作用域，loopVal = 1 被重新初始化，前一次的 loopVal++ 完全被丢弃；同时，resolve() 后续的语句（如 loopVal++）根本不会执行——因为 resolve() 已使 Promise 进入 fulfilled 状态，执行器函数随即退出。
要实现真正的跨异步递增，关键在于：将状态（即当前值）显式地作为参数传入，并通过 resolve() 显式返回更新后的值，由 await 捕获并赋给外部变量。以下是重构后的可靠实现：
const hi = function(val, delay) {
return new Promise((resolve, reject) => {
setTimeout(() => {
console.log("Resolved Successfully", val);
resolve(val + 1); // ✅ 返回递增值，供 await 捕获
}, delay);
});
};
const bye = async () => {
let val = 1; // ✅ 状态提升至 async 函数作用域
val = await hi(val, 1000); // → resolve(2), val 变为 2
val = await hi(val, 1000); // → resolve(3), val 变为 3
console.log("Final value", val); // 输出: Final value 3
return "bye";
};
bye().then(value => console.log(value)); // 输出: bye✅ 核心要点总结：
- ❌ 避免在 Promise 执行器内依赖闭包修改局部变量（作用域隔离导致状态丢失）；
- ✅ 将状态作为参数传入异步函数，确保每次调用都基于最新值；
- ✅ 使用 resolve(newValue) 显式返回更新结果，配合 await 实现值的链式传递；
- ✅ 在 async 函数中用 let 声明可变状态变量，并持续用 await 赋值更新。
此模式不仅适用于计数器，也广泛适用于需维护中间状态的异步流程（如分页请求、重试计数、进度累积等），是构建可预测、可调试异步逻辑的基础实践。
