遍历父对象键时Javascript子对象为空的问题排查

这问题我之前也碰到过，典型的异步场景下对象状态不一致的坑——控制台显示的和代码执行时拿到的不是同一个状态！

核心原因 #

控制台里的对象是实时引用，当你展开它的时候才会读取最新状态，但代码执行循环的瞬间，那个自动生成键对应的嵌套对象还没被异步填充完成。所以当时打印出来是空对象，等你后来去看控制台的时候，对象已经被后续的异步操作赋值了，就出现了“控制台显示正常，代码里拿不到”的矛盾。

你说代码在函数外正常、异步回调里不行，刚好印证了这点：外部执行时对象已经完全初始化完毕，而异步回调触发时，虽然计数器让你以为所有调用都结束了，但可能嵌套的子对象还在被异步赋值（比如operator这类属性是通过额外请求获取的，你的计数器没把这些内层Promise纳入等待范围）。

快速验证方法 #

你可以在循环里加一行深拷贝的打印，看看代码执行瞬间的真实值：

console.log(i, JSON.parse(JSON.stringify(detail[i])));

如果这行打印出来是空，那就实锤了：循环执行时detail[i]确实还没被赋值；如果能打印出完整对象，那就是控制台的实时显示特性误导了你。

可行解决方案 #

1. 补全异步等待逻辑：检查你的计数器，是不是只等了顶层的异步调用，漏了内部属性的异步初始化。比如如果子对象是通过另一个Promise获取的，要把这些Promise也加入等待队列，确保整个对象树都填充完成后再执行遍历。
2. 改用Object.entries()遍历：这种写法更直观，也能帮你更清晰地捕获当前的键值对状态：

detailArray.forEach((detail) => {
  Object.entries(detail).forEach(([key, value]) => {
    console.log(key, JSON.parse(JSON.stringify(value)));
  });
});

3. 临时延迟调试（仅用于验证）：如果只是想确认对象最终会有值，可以加个短暂延迟（生产环境别用）：

setTimeout(() => {
  detailArray.forEach((detail) => {
    for(var i in detail) {
      if (detail.hasOwnProperty(i)) {
        console.log(i, detail[i]);
      }
    }
  });
}, 1000);

如果延迟后能拿到正确值，就说明确实是异步初始化的问题，重点调整你的等待逻辑即可。

补充说明 #

你的测试代码在同步环境下完全正常，因为对象是直接初始化的，没有异步赋值的过程。但实际业务场景里的异步回调中，对象的填充往往是分步进行的，这就导致代码执行时内部对象还没准备好。

内容的提问来源于stack exchange，提问作者Juan Pablo Cruz