Promise已resolve结果赋值给scope变量时取值未定义的问题排查

你遇到的scope.stuff为undefined的问题，本质是代码执行顺序和异步逻辑的时机错位，是刚接触Promise的开发者非常容易踩的坑：

• service.getStuff()返回的Promise是异步操作，.then()内部的赋值回调，不会在写完链式调用时立刻执行。JS引擎会先把所有同步代码跑完，等Promise完成所有异步逻辑、拿到resolve的返回值之后，才会把.then的回调塞到任务队列里触发，给scope.stuff赋值。
• 如果你在service.getStuff().then(...)的调用语句之后，直接写同步代码打印/使用scope.stuff，此时.then里的回调还没被执行，scope.stuff自然是未初始化的undefined状态。这个问题和你写的赋值逻辑本身没有冲突，只是读取值的时机不对。

• 确认Promise没有走到reject分支：如果异步请求报错、被异常中断，.then里的赋值逻辑根本不会触发，一定要补对应的错误捕获逻辑，不然就算Promise没正常resolve，你也只会看到undefined，找不到报错原因。
• 确认返回值的字段匹配：可以在.then回调里先打印完整的返回结构stuff，确认字段'cool stuff'存在、拼写完全一致（注意字段名里的空格），避免因为字段名拼错、嵌套层级不对导致取值为undefined。

所有依赖scope.stuff的业务逻辑，都必须放到Promise的执行链内部，不能在Promise链外部直接读取赋值后的值，常见写法如下：

1. 基础Promise链写法

service.getStuff()
    .then((stuff) => {
        scope.coolStuff = stuff['cool stuff'];
        // 所有依赖coolStuff的逻辑都在这里编写，此时能拿到正确赋值
        console.log(scope.coolStuff);
    })
    .catch((err) => {
        // 错误处理，避免异常无感知
        console.error('数据获取失败', err);
    });

2. async/await 同步风格写法
   如果想要贴近你最初预期的顺序写法，可以把异步逻辑封装到async函数中，用await等待Promise返回结果，代码读起来和原生同步逻辑一致：

async function setGlobalScope() {
    try {
        const stuff = await service.getStuff();
        scope.coolStuff = stuff['cool stuff'];
        // 这里可以直接顺序编写依赖coolStuff的逻辑
        console.log(scope.coolStuff);
    } catch (err) {
        console.error('数据获取失败', err);
    }
}
// 触发初始化流程
setGlobalScope();

注意：不要为了在同步代码里读取到Promise的结果，用阻塞式的写法等待异步返回，这会破坏JS的事件循环机制，违背Promise的设计初衷。

内容的提问来源于stack exchange，提问作者user319407