《八》TypeScript 中的模块化

TypeScript 支持很多模块化的方案，但最主要的是 ES Module。

JavaScript 规范声明任何没有 export 的 JavaScript 文件都应该被认为是一个脚本，而非一个模块，在一个脚本文件中，变量会被声明在共享的全局作用域中。而模块是有独立作用域的，可以通过添加 export {] 来将其变为一个模块。

在 ES Module 之前，TypeScript 支持命名空间，使用 namespace 命名空间名称 {} 来创建，使其有独立的作用域。目前，命名空间虽然没有被废弃掉，但官方更推荐使用 ES Module，所以最好不要再使用了。

// index.ts 脚本文件
// 直接在一个脚本文件中定义相同的变量，出现了命名冲突
function format() {}
function format() {}

// index.ts 脚本文件
// 使用命名空间，有了独立的作用域，不会再命名冲突了
namespace price {
  function format() {}
}
namespace date {
 function format() {}
}

类型导出和导入：

除了支持 JavaScript 中 ES Module 的功能外，TypeScript 还支持类型的导出和导入。

其中，导入类型时最好添加 type 前缀来表明导入的是一个类型，因为 TypeScript 的类型只是在编写代码的过程中提供类型检测，在编译后都会被移除的，这可以让非 TypeScript 的编译器（例如：Babel）知道什么样的导入可以被安全移除。

// type.ts
// 导出类型
export interface IPerson {
  name: string,
  age: number,
}
export type IDType = number | string

// index.ts
// 导入类型
import {type IPerson. type IDType} from "./type"
// 也可以使用这种方式：
import type {IPerson, IDType } from "./type"

// 使用类型
let p: IPerson = {
  name: 'Lee',
  age: 18,
}
let id: IDType = 1