在对象内部导入

Question

我是 TypeScript 的新手，正在尝试将我当前的 JavaScript 转换为 TypeScript。

在 JS 中，我有如下结构：

var roles = {
    x: require('role.x'),
    y: require('role.y')
};

为了以后像这样迭代这些角色：

for (var index in roles) {
  var role = new roles[index];
  if (someObject.role == role.role) {
    role.run(someObject);
  }
}

然而，在 TypeScript 中，我似乎无法做到这一点：

let roles = {
  x: import X from "./roles/x"
}

产量

Error:(11, 14) TS1109: Expression expected.
Error:(11, 21) TS1005: ':' expected.
Error:(11, 31) TS1005: ',' expected.
Error:(11, 36) TS1005: ':' expected.

那么，与实现相同-或-替代方法更清洁/TypeScript 方式的 TypeScript 等价物是什么？

Answer 1

为了完整起见，现在（以及自 2017 年以来），另一种方法是使用动态导入语句。

V8 Specs 提供更多信息。

import() 语句返回一个承诺。

因此，理论上，这应该可以工作（并且看起来更类似于 JS require 代码）：

let roles = {
    x: await import('./roles/x'),
    y: await import('./roles/y')
};

如果你想从导入的文件中分配一个特定的功能/实体，你应该可以这样：

let roles = {
    x: await (async () => {let {X} = await import('./roles/x'); return X;})()
    y: await (async () => {let {Y} = await import('./roles/x'); return Y;})()
};

如果有人喜欢使用.then() 代替（用于并发），那么this StackOverflow 答案显示将 await 替换为 .then() 以将返回的承诺分配给对象键。

我希望这会有所帮助。

Answer 2

必须在模块的顶层找到 ES6 导入，否则会出现语法错误。

import * as x from "./roles/x";
import * as y from "./roles/y";

let roles = {x, y};

Answer 3

这不是关于 TypeScript，而是关于 ES6。导入是静态的，不能动态使用：

import * as x from "./roles/x";
import * as y from "./roles/y";
let roles = {
    x: x,
    y: y
};

见a good introduction to ES6 modules here。在“静态与动态”部分：

对于一门动态语言，JavaScript 拥有令人惊讶的静态模块系统。

• import 和 export 的所有风格只能在模块的顶层使用。没有条件导入或导出，您不能在函数范围内使用导入。

• 所有导出的标识符必须在源代码中按名称显式导出。您不能以编程方式循环遍历数组并以数据驱动的方式导出一堆名称。