Typescrip{过滤}t模块的导入和导出

admin

在ECMAscrip{过滤}t 2015标准里，Javascrip{过滤}t新增了模块的概念。Typescrip{过滤}t也沿用了这个概念。

一、模块的导入和导出

模块在其自身的作用域里执行，而不是在全局作用域里；这意味着定义在一个模块里的变量，函数，类等等在模块外部是不可见的，除非你明确地使用export之一导出它们。 相反，如果想使用其它模块导出的变量，函数，类，接口等的时候，你必须要导入它们，可以使用import之一。

模块是自声明的。在Typescrip{过滤}t里，两个模块之间的关系是通过在文件级别上使用import和export建立的。下面是一个基本例子：

animal.ts

登录可见。

app.ts

登录可见。

上面的例子里，在animal.ts里声明了一个类Animal，通过export导出。在app.ts里，指定相对文件路径，通过import导入，就可以使用Animal类。

因为Javascrip{过滤}t存在两种不同的模块引用方式，在编译成Javascrip{过滤}t时，可以通过Typescrip{过滤}t配置文件tsconfig.json指定编译之后的模块引用方式

登录可见。

下面分别是使用不同的方式编译后的Javascrip{过滤}t文件内容

commonjs

登录可见。

登录可见。

amd

登录可见。

登录可见。

二、导入和导出的重命名

模块导入和导出时默认使用的内部对象的名称。Typescrip{过滤}t也支持在导出前和导入后进行重命名。将上面的例子修改一下

animal.ts

登录可见。

app.ts

登录可见。

导入和导出时，通过as关键字对模块进行重命名。

这个地方有一点要注意，当导出的模块重命名后，导入时重命名前的模块名要与导出重命名后的模块名保持一致，否则编译器将提示错误信息。以上面的这个例子为例，导出的模块被重命名为ANI，将此模块在另外一个文件app.ts里导入时，as关键字前面的模块名必须是ANI。

或者，如果不知道导入模块的名称，则可以用*号代替

登录可见。

上面的例子里，对*号代替的所有模块进行重命名为animal_module，则通过animal_module对象可以访问到模块里导出的所有内容。

三、导出和导出多个对象

通常情况，模块里会定义多个类型对象，然后一并导出。而导入的模块里也可能会有多个

animal.ts

登录可见。

app.ts

登录可见。

导出时，可以将要导出的类型对象重新组装成一个json对象，然后导出。导入后，可以通过重命名的模块对象访问里面的内容。

四、默认导出

一个模块的默认导出只能有一个

animal.ts

登录可见。

app.ts

登录可见。

在上面的例子里，通过default关键字，将Animal类导出。与一般的导入不同的是，导入默认的导出模块时，可以直接指定导入的模块名称，而不需要用{}花括号括起来。

五、动态加载模块

因为在Javascrip{过滤}t里，模块加载方式分别有两种：CommonJS和AMD。在用Typescrip{过滤}t时，要根据最终编译生成Javascrip{过滤}t的方式的配置内容不同，编写不同的代码。

模块文件animal.ts

登录可见。

CommonJS方式引用：

app.ts

登录可见。

AMD方式引用：

app.ts

登录可见。