面试题：TypeScript模块化下如何处理循环依赖问题

模块初始化顺序混乱：在循环依赖中，模块A依赖模块B，模块B又依赖模块A。这可能导致在初始化模块A时，需要先初始化模块B，但初始化模块B时又需要模块A已经初始化完成，从而造成初始化顺序的困境，使得程序运行结果不可预测。
数据未定义问题：由于模块加载和初始化的不确定性，可能会导致在某个模块中使用到另一个模块中未完全初始化的数据，从而引发运行时错误，比如undefined引用等问题。

将循环依赖的部分提取到一个独立的模块中，使原来相互依赖的模块通过这个新模块进行交互。

例如，假设我们有两个模块moduleA.ts和moduleB.ts存在循环依赖：

// moduleA.ts
import { bFunction } from './moduleB';

export function aFunction() {
    return bFunction();
}

// moduleB.ts
import { aFunction } from './moduleA';

export function bFunction() {
    return aFunction();
}

重构为：

// shared.ts
export function sharedFunction() {
    return 'Shared functionality';
}

// moduleA.ts
import { sharedFunction } from './shared';

export function aFunction() {
    return sharedFunction();
}

// moduleB.ts
import { sharedFunction } from './shared';

export function bFunction() {
    return sharedFunction();
}

动态导入是异步的，可以避免在模块加载阶段出现循环依赖问题。

例如：

// moduleA.ts
export async function aFunction() {
    const { bFunction } = await import('./moduleB');
    return bFunction();
}

// moduleB.ts
export async function bFunction() {
    const { aFunction } = await import('./moduleA');
    return aFunction();
}

在实际应用中，这种方法更适用于某些逻辑可以异步执行的场景，因为动态导入是异步操作，需要在async函数中使用。

星途面试题库