ES6 模块是 JavaScript 中用于组织代码的一种模块化系统，它可以方便地分离代码并将其组织成独立的模块。而 TypeScript 中提供了更强大的静态类型检查功能，使得开发者能够更加安全地管理代码，在进行模块化开发过程中，如何使用 ES6 模块已成为必修基础课程。
在 TypeScript 中，我们可以通过以下方法来使用 ES6 模块：
导入模块
导入模块是使用 ES6 模块的第一步，使用 import 语句可以让我们将已存在的模块引入到当前的模块中。在 TypeScript 中导入模块可以使用以下语法：
------ - ---------- - ---- ---------------
这个语法行中，我们通过花括号 {} 来列出需要导入的名称，在这个例子中，我们从名为 ./moduleName 的模块中导入了一个名为 ModuleName 的成员变量。
导入默认成员
有时我们需要从一个模块中导入默认成员，这时候我们可以使用以下语法：
------ ------- ---- ---------------
这里的 Default 就是指向默认导出的变量名字，如果一个 ES6 模块只导出了一个默认成员，那么我们可以用这种方式来导入它。
导出模块
导出模块同样也是使用 ES6 模块必须掌握的一项技能。在 TypeScript 中我们可以通过以下语法来导出模块：
------ ---------- - ---------------------
在这个例子中，我们创建了一个名为 moduleName 的变量并将它导出，默认情况下这个变量是可以被其他的模块使用的。
我们也可以将一个默认的变量导出：
------ ------- ----------------------------
这里，我们使用了 default 关键字来将这个变量设置为默认的导出成员，这就意味着其他模块可以使用 import 语句来获取这个默认成员。
下面来看几个 TypeScript 中的 ES6 模块的实例：
-- ---- ------ - --- - ---- -------- ------ - ----- - ---- ---------- ------ ------------ ---- ---------- -- ---- ----- ---- --- - --- ------ ----- ------ ----- - --- -------- -------------------------- -- ---- ------ ----- --- - -- ----- ----------------- - ------ ----- ----- - -- ----- ----------------- - ------ ------- ----------------------------
这个例子中，我们首先通过 import 语句从 ./car 和 ./truck 中导入了 Car 和 Truck 类，以及从 ./truck 中导入了默认导出成员 DefaultTruck。
然后实例化 Car 和 Truck 类并输出了 DefaultTruck 的值，最后我们又将两个类通过 export 关键字导出到当前的模块中，并将一个默认导出成员设置为了字符串 ExportedModuleDefaultName。
总结
在 TypeScript 中使用 ES6 模块，我们需要掌握两个关键词，import 和 export。使用 import ourClass from 'ourModule' 可以导入特定的变量或者类，使用export class ClassName { } 会将类 ClassName 导出供其他模块使用。它们的使用可以让我们更好地管理和组织代码，提高可维护性和开发效率。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6641dbd6d3423812e4fda7f9