外观
TypeScript-d.ts类型声明文件
766字约3分钟
2024-10-08
在TypeScript 中,类型声明文件( .d.ts 文件)用于为 JavaScript 模块提供类型信息。这些文件允许 TypeScript 编译器理解 JavaScript 模块的接口和类型,从而在开发过程中提供更好的类型检查和代码补全功能。
- 类型声明:
.d.ts文件包含类型声明,描述了模块、函数、类、接口等的类型信息。 - 不包含实现:这些文件只包含类型信息,不包含实际的实现代码。
 - 通常用于为没有 TypeScript 类型定义的 JavaScript 库或者插件提供类型支持。
 
类型声明文件
创建一个 math.js 文件:
// math.js
function add(a, b) {
    return a + b;
}
function subtract(a, b) {
    return a - b;
}
module.exports = { add, subtract };为上述 math.js 文件创建一个类型声明文件 math.d.ts:
// math.d.ts
declare module 'math' {
    export function add(a: number, b: number): number;
    export function subtract(a: number, b: number): number;
}我们可以在 math.d.ts 文件中声明 math 模块,并使用 declare module 语法来定义模块的导出函数的类型。
// app.ts
import { add, subtract } from 'math';
const sum = add(5, 3);
const difference = subtract(5, 3);
const difference1 = subtract(5, '3'); // 报错
console.log(`Sum: ${sum}`); // 输出: Sum: 8
console.log(`Difference: ${difference}`); // 输出: Difference: 2如上所示,我们可以在 TypeScript 文件中导入 math 模块,并使用 add 和 subtract 函数,TypeScript 编译器将根据 math.d.ts 文件中的类型声明进行类型检查和代码补全。
/// 三斜杠命令
在 TypeScript 中,三斜杠命令(Triple-Slash Directives)是一种特殊的注释语法,用于在 TypeScript 文件中引入其他类型声明文件或模块。这些命令以 /// 开头,通常用于提供编译器指令。
1. /// <reference path="" />
/// <reference path="" /> 命令用于引入其他 TypeScript 文件。它告诉编译器在编译当前文件时,需要包含指定的文件。这通常用于在同一个项目中引用其他模块或类型声明文件。
例如,假设我们有一个 math.ts 文件和一个 math.d.ts 文件,我们可以在 math.ts 文件中使用 /// <reference path="math.d.ts" /> 命令来引入 math.d.ts 文件:
/// <reference path="math.d.ts" />
import { add, subtract } from 'math';
const sum = add(5, 3);
const difference = subtract(5, 3);
console.log(`Sum: ${sum}`); // 输出: Sum: 8
console.log(`Difference: ${difference}`); // 输出: Difference: 22. /// <reference types="" />
types 参数用来告诉编译器当前脚本依赖某个 DefinitelyTyped 类型库,通常安装在 node_modules/@types 目录。
types 参数的值是类型库的名称,也就是安装到 node_modules/@types 目录中的子目录的名字。
/// <reference types="lodash" />
import _ from 'lodash';
const array = [1, 2, 3, 4, 5];
const doubled = _.map(array, (num) => num * 2);
console.log(doubled); // 输出: [2, 4, 6, 8, 10]3. /// <reference lib="" />
lib 参数用来告诉编译器当前脚本依赖某个内置类型库,通常不需要手动指定,编译器会自动根据目标 ECMAScript 版本选择合适的内置类型库。
lib 参数的值是内置类型库的名称,例如 es2015、es2016、es2017 等。
/// <reference lib="es2015" />