1 声明语句

如果我们使用第三方库如 jQuery ,通常是用 <script> 标签引入,然后就能使用全局注册的 $jQuery 变量了。

  1. $(document);
  2. // 或者
  3. jQuery(document);

但对于 TypeScript 编译器而言,它并不知道 $jQuery 是什么,因此编译时会抛出异常:

  1. $(document); // ERROR: 找不到名称 "$"。是否需要安装 jQuery 的类型定义?

因此需要用到 TypeScript 中的声明语句来对第三方全局变量进行声明,如:

  1. declare var $: (selector: string) => any;

declare var 之外还有很多其他作用的声明语句
❗❗❗注意:声明语句只能用作类型定义而非功能实现

  1. // ERROR: 不允许在环境上下文中使用初始化表达式。
  2. // ERROR: 不能在环境上下文中声明实现。
  3. declare var jQuery = function (selector: string): any {
  4. return document.querySelector(selector);
  5. }

2 声明文件

一般我们会将声明语句放到一个单独的文件以便维护, TypeScript 声明文件必须以 .d.ts 为后缀,如 jQuery.d.ts 。 TypeScript 解析时一般会加载所有的 *.ts 文件,因此也会加载声明文件,这样在实际的 .ts 程序就能获得对应的声明提示了。

2.1 第三方声明文件

对于常用的第三方库,如 jQuery ,社区已经帮我们编写好对应的声明文件了 jQuery in DefinitelyTyped ,我们只需要下载使用即可。
更常见的方法是使用 @types 统一管理第三方声明文件,如使用 npm 安装 jQuery 的声明文件:

  1. npm i -D @types/jquery

2.2 自动生成声明文件

如果自己本身项目是用 TypeScript 编写,可在 TypeScript 编译时添加 declaration 选项自动生成对应的声明文件 .d.ts ,用法有: