在初始化之前无法访问枚举,反应打字稿

dog*_*age 5 typescript reactjs

在我的程序中,我有很多带有这样的枚举定义的文件以及一些将枚举连接在一起的文件。枚举是字符串枚举,因此索引不是问题的一部分。当我将枚举连接在一起时,出现错误“在初始化之前无法访问‘两者’”。还有循环导入,因为我在第一个文件中使用组合枚举。我理解该错误消息,但是在定义“两者”之前我导入了包含必要枚举的文件。这是打字稿错误还是我遗漏了什么?我在 React 环境中使用 typescript,所以也许我缺少正确的 tsconfig 行。



// firstFile.ts

export enum One
{
    A,
    B,
}

export enum Two
{
    C = 2,
    D,
}


// secondFile.ts, throws error

import { One, Two } from './firstFile';

export const Both = 
{
    ...One,
    ...Two,
}

Run Code Online (Sandbox Code Playgroud)

Twi*_*her 3

TypeScript(以及 ECMAScript)中允许循环依赖,and子句的静态解析将起作用,但您必须注意文件的执行顺序,具体取决于入口点。事实上,当满足循环依赖时,入口点充当依赖树的主干,因此其他文件先于其执行。当一个文件执行其所有顶级代码时,如果遇到未解析的变量,则会执行 , 和 ,并将失败。importexport

现在让我们看看在您的具体情况下会发生什么。您的代码会转换为如下内容:

第一个文件.ts

import { Both } from "./secondFile.js";
export var One;
(function (One) {
    One[One["A"] = 0] = "A";
    One[One["B"] = 1] = "B";
})(One || (One = {}));
export var Two;
(function (Two) {
    Two[Two["C"] = 2] = "C";
    Two[Two["D"] = 3] = "D";
})(Two || (Two = {}));
Run Code Online (Sandbox Code Playgroud)

第二个文件.ts

import { One, Two } from './firstFile.js';
export const Both = Object.assign(Object.assign({}, One), Two);
Run Code Online (Sandbox Code Playgroud)

如果您用作secondFile.ts入口点,firstFile.ts将首先执行并且不会抛出任何错误,因为BothfirstFile.ts.

console.log(Both.A)但是,如果您在末尾添加 a ,firstFile.ts它将失败并出现Cannot access 'Both' before initialization错误,因为secondFile.ts尚未执行,因此Both已导出但未初始化。