TypeScript(五)

---

类型声明文件

类型声明文件：用来为已存在的 JS 库提供类型信息。这样在 TS 项目中使用这些库时，就像用 TS 一样，都会有代码提示、类型保护等机制了。

TS的两种文件类型

1. .ts文件

• 既包含类型信息又可执行代码。
• 可以被编译为.js文件，然后执行代码
• 用途：编写程序代码的地方。

2. .d.ts文件

• 只包含类型信息的类型声明文件
• 不会生成 .js 文件，仅用于提供类型信息。
• 用途：为 JS 提供类型信息

总结：.ts 是 implementation（代码实现文件）；.d.ts 是 declaration（类型声明文件）。
如果要为 JS 库提供类型信息，要使用 .d.ts 文件。

类型声明文件的使用说明

内置类型声明文件

TS 为 JS 运行时可用的所有标准化内置 API 都提供了声明文件。

可以通过 Ctrl + 鼠标左键（Mac：option + 鼠标左键）来查看内置类型声明文件内容。

查看 forEach 方法的类型声明，在 VSCode 中会自动跳转到 lib.es5.d.ts 类型声明文件中。

window、document 等 BOM、DOM API 也都有相应的类型声明（lib.dom.d.ts）。

第三方库的类型声明文件

• 库自带类型声明文件
  
  这种情况下，正常导入该库，TS 就会自动加载库自己的类型声明文件，以提供该库的类型声明。

• 由 DefinitelyTyped 提供

DefinitelyTyped 是一个 github 仓库，用来提供高质量 TypeScript 类型声明。
可以通过 npm/yarn 来下载该仓库提供的 TS 类型声明包，这些包的名称格式为：@types/*。

比如，@types/react、@types/lodash 等。
说明：在实际项目开发时，如果你使用的第三方库没有自带的声明文件，VSCode 会给出明确的提示。

当安装 @types/* 类型声明包后，TS 也会自动加载该类声明包，以提供该库的类型声明。
补充：TS 官方文档提供了一个页面，可以来查询 @types/* 库。

项目类型共享

如果多个.ts文件中都用到同一个类型， 此时可以创建.d.ts文件提供该类型，实现类型共享

type Props = {x: number, y: string}
export {Props}

1. 创建 index.d.ts 类型声明文件。
2. 创建需要共享的类型，并使用 export 导出（TS 中的类型也可以使用 import/export 实现模块化功能）。
3. 在需要使用共享类型的 .ts 文件中，通过 import 导入即可（.d.ts 后缀导入时，直接省略）。

为已有JS提供类型声明

• 在将 JS 项目迁移到 TS 项目时，为了让已有的 .js 文件有类型声明。
• 成为库作者，创建库给其他人使用。