在javascript中的父类中导入子类

Question

我有一个类层次结构，例如扩展父级的Parent、Child1、Child2 等。 Parent 存储一组子项，我需要在 Parent 中导入 Child1 和 Child2。

这显然会导致循环依赖并在尝试创建 Child1 或 Child 2 时抛出以下错误：

TypeError: Super expression must either be null or a function

有什么办法可以解决这个问题？

例如，考虑以下结构：

parent.js

export default class Parent {
    itemArray = []
}

child1.js

import Parent from "./parent.js"
export default class Child1 extends Parent {
}

child2.js

import Parent from "./parent.js"
export default class Child2 extends Parent {
}

itemArray 递归存储Child1 或Child2

现在我需要对 itemArray 进行类型注释，以便 parent.js 如下所示：

parent.js

import Child1 from "./child1"
import Child2 from "./child2"

export default class Parent {
    @Types(() => [Child1, Child2])
    itemArray = []
}

当最终对象是从普通对象构造时，此注释允许为数组中的每个项目分配正确的类。但这就是细节。问题是：

如何允许这样的结构不破坏整个层次结构？

Answer 1

解决方案简单易懂。该解决方案背后的想法是在不同的模块中导入分层的类。

// internal.js (New Js File)
// This module imports and exports
// Parent and Child classes will import classes from here.

export { Parent } from "./parent.js";
export { Child1 } from "./child1.js";
export { Child2 } from "./child2.js";

您可以从“internal.js”导入所需的类。举个例子：

// parent.js

import { Child1 } from "./internal.js";
import { Child2 } from "./internal.js";

export class Parent {
     // @Types annotation method here..
     itemArray = [];
}

输出：

// index.js file to output result

import { Parent } from "./internal.js";
import { Child1 } from "./internal.js";
import { Child2 } from "./internal.js";

var child1 = new Child1();
var child2 = new Child2();
var parent = new Parent();

parent.itemArray.push(child1);
parent.itemArray.push(child2);


console.log(parent.itemArray.length); //it prints '2'