时间戳

首页 > 解决方案 > 是否可以从目录中导入所有类并初始化它们？

javascript - 是否可以从目录中导入所有类并初始化它们？

问题描述

假设这就是我的目录树的样子：

/
  Children/
    ChildrenIndex.js
    Base.js
    ChildA.js
    ChildB.js
    ChildC.js
    ...
    ChildN.js

  Main.js

任何给定的ChildX.js看起来像这样的地方，

import Base from './Base.js';

class ChildX extends Base {
  constructor(params) {
    this.params = params
  }
}

export default ChildX

ChildrenIndex.js看起来像这样，

export {default as ChildA} from './ChildA.js';
export {default as ChildB} from './ChildB.js';
export {default as ChildC} from './ChildC.js';
...
export {default as ChildN} from './ChildN.js';

是否有可能我可以导入Base.jsin的所有孩子Main.js并获得一个充满实例的列表，每个孩子的初始化？这是做我想要的伪代码：

import { * } from './Children/ChildrenIndex.js'

class Main {
  constructor() {
    let childConstructors = getAllConstructorsIn('./Children/ChildrenIndex.js');
    let children = [];
    for (let constrt of childConstructors) {
      children.push(new constrt(params));
    }
  }
}

我可以手动执行此操作import { ChildA, ChildB, ChildC, ... ,ChildN } from './Children/ChildrenIndex.js'，然后像这样填写列表[new ChildA(params), new ChildB(params), new ChildC(params), ... , new ChildN(params)]：而且，这很好用。但是，我希望有人能够Base.js在子目录中放置一个实现，以便添加新功能，而不必担心在代码的其他部分编写导入语句和初始化。如果相关的话，我会在 React 应用程序模型中执行此操作。

标签： javascriptimport

解决方案

这应该适用于Main.js：

import * as Children from "./Children/ChildrenIndex";

Children.ChildA // ChildA component
Children.ChildB // ChildB component

推荐阅读