TypeScript声明文件和关键字declare
1. 外部声明
TypeScript语言主要有两种类型的源文件:
- 文件扩展名为“.ts”或“.tsx”的文件。
- 文件扩展名为“.d.ts”的文件。
“.ts”或“.tsx”文件中包含了应用的实现代码,它也是开发者日常编写的代码。“.ts”和“.tsx”文件中既可以包含类型声明又可以包含可执行代码。在编译TypeScript程序的过程中,“.ts”和“.tsx”文件会生成对应的“.js”和“.jsx”文件。值得一提的是,“.tsx”文件中包含了使用JSX语法编写的代码。JSX采用了类似于XML的语法,JSX因知名的React框架而流行,因为React框架推荐使用JSX来编写应用程序。
“.d.ts”文件是类型声明文件,其中字母“d”表示“declaration”,即声明的意思。“.d.ts”文件只提供类型声明,不提供任何值,如字符串和函数实现等。因此,在编译TypeScript程序的过程中,“.d.ts”文件不会生成对应的“.js”文件。
我们可以将“.d.ts”文件称作或简称为。声明文件中的内容是外部声明。外部声明用于为已有代码提供静态类型信息以供TypeScript编译器使用。例如,知名代码库jQuery的外部声明文件提供了jQuery API的类型信息。TypeScript编译器能够利用该类型信息进行代码静态类型检查以及代码自动补全等操作。
外部声明也可以出现在“.ts”文件中,我们只需明确外部声明是类型声明而不是具体实现,外部声明在编译后不会输出任何可执行代码即可。
外部类型声明通过declare
关键字来定义,包含外部变量声明、外部函数声明、外部类声明、外部枚举声明和外部命名空间声明。eg:
//外部变量声明
declare var a: boolean;
declare let b: boolean;
declare const c: boolean;
// 外部函数声明
declare function f(a: string, b: boolean): void;
// 外部枚举声明
declare enum Foo {
A,
B,
}
//外部模块声明的语法
declare module 'io' {
export function readFile(filename: string): string;
}
2 . TypeScript语言内置的声明文件
当我们在计算机中安装了TypeScript语言后,同时也安装了一些语言内置的声明文件,它们位于TypeScript语言安装目录下的lib文件夹中(如目录:C:\Users\Administrator\AppData\Roaming\npm\node_modules\typescript\lib)。下面列举了部分内置的声明文件:
lib.d.ts
lib.dom.d.ts
lib.es2015.d.ts
lib.es2016.d.ts
lib.es2017.d.ts
lib.es2018.d.ts
lib.es2019.d.ts
lib.es2020.d.ts
lib.es5.d.ts
lib.es6.d.ts
TypeScript语言内置的声明文件统一使用“lib.[description].d.ts”命名方式,其中,description部分描述了该声明文件的内容。在这些声明文件中,既定义了标准的JavaScript API,如Array API、Math API以及Date API等,也定义了特定于某种JavaScript运行环境的API,如DOM API和Web Workers API等。
TypeScript编译器在编译代码时能够自动加载内置的声明文件。因此,我们可以在代码中直接使用那些标准API,而不需要进行特殊的配置。例如,我们可以在代码里直接使用标准的DOM方法,TypeScript能够从内置的声明文件“lib.dom.d.ts”中获取该方法的类型信息并进行类型检查。示例如下:
const button = document.getElementById('btn');