JavaScript对象数组无法正确导入

Question

我将此对象数组定义为：

export const trace: IStackTrace[] = [
  {
    ordered_globals: ["c"],
    stdout: "",
    func_name: "<module>",
    stack_to_render: [],
    globals: {
      c: ["REF", 1]
    },
    heap: {
      "1": ["ARRAY", 1, ["REF", 2]],
      "2": ["ARRAY", 2, null]
    },
    line: 2,
    event: "return"
  },
  {
    ordered_globals: ["c", "d"],
    stdout: "",
    func_name: "<module>",
    stack_to_render: [],
    globals: {
      c: ["REF", 1],
      d: ["REF", 3]
    },
    heap: {
      "1": ["ARRAY", 1, ["REF", 2]],
      "2": ["ARRAY", 2, null],
      "3": ["ARRAY", 1, ["REF", 1]]
    },
    line: 2,
    event: "return"
  }
];

导入：

import { trace } from "./Examples";

此代码有效；

const StackTraceView = (props: IProps) => {
   const [stepNumber, setStepNumber] = useState<number>(0);
   const trace = ...
   const currentTrace = trace[stepNumber];
   // ...
}

这不是

import { trace } from "./Examples";

const StackTraceView = (props: IProps) => {
   const [stepNumber, setStepNumber] = useState<number>(0);
   const currentTrace = trace[stepNumber];
   // ...
}

这些对象对我来说似乎相同。但是我的观点不同。

当我在React组件中如上所述声明并初始化此变量时，此变量将按预期工作，并且我的显示器显示跟踪。但是，当我将该对象放入另一个文件并导入时，或者如果我在“全局”空间中声明该对象，则该对象的深层属性似乎为空，并且显示会中断。

我不知道在函数作用域内声明此深对象数组与导入它之间有什么区别。我尝试对对象进行深层克隆，但结果仍然相同。

任何帮助您了解正在发生的事情的人。

编辑：添加了更多上下文。真正的问题是，该变量在函数内声明或在函数范围外声明时使用变量之间有什么区别。

Answer 1

我发现是否像以前一样导入对象数组，然后运行：

const traceJson: string = JSON.stringify(trace);
// then
const traceObject = JSON.parse(traceJson);
// ...

这正常工作。我仍然不知道是什么原因造成的。它必须是我要导入的对象的格式。在某种程度上，函数必须在函数范围之外纠正JSON不规则性，而不能。

如果有人看到我的JSON有问题，并且/或者可以告诉我这些范围之间的区别是什么，我将很乐于学习并将您的答案标记为接受。

谢谢大家的帮助。