如何编写 Typescript 声明文件

简介: 使用TypeScript已经有了一段时间,这的确是一个好东西,虽说在使用的过程中也发现了一些bug,不过都是些小问题,所以整体体验还是很不错的。TypeScript之所以叫Type,和它的强类型是分不开的,这也是区别于JavaScript最关键的一点,类型的声明可以直接写在代码中,也可以单独写一个用来表示类型的描述文件*.d.ts。

使用TypeScript已经有了一段时间,这的确是一个好东西,虽说在使用的过程中也发现了一些bug,不过都是些小问题,所以整体体验还是很不错的。

TypeScript之所以叫Type,和它的强类型是分不开的,这也是区别于JavaScript最关键的一点,类型的声明可以直接写在代码中,也可以单独写一个用来表示类型的描述文件*.d.ts

常用方式

首先在d.ts中是不会存在有一些简单的基本类型定义的(因为这些都是写在表达式、变量后边的,在这里定义没有任何意义),声明文件中定义的往往都是一些复杂结构的类型。

大部分语法都与写在普通ts文件中的语法一致,也是export后边跟上要导出的成员。

最简单的就是使用type关键字来定义:

type A = {                 // 定义复杂结构
  b: number
  c: string
}

type Func = () => number   // 定义函数

type Key = number | string // 多个类型

组合类型

以及在TypeScript中有着很轻松的方式针对type进行复用,比如我们有一个Animal类型,以及一个Dog类型,可以使用&来进行复用。

P.S> &符号可以拼接多个

type Animal = {
  weight: number
  height: number
}

type Dog = Animal & {
  leg: number
}

动态的 JSON 类型指定

如果我们有一个JSON结构,而它的key是动态的,那么我们肯定不能将所有的key都写在代码中,我们只需要简单的指定一个通配符即可:

type info = {
  [k: string]: string | number // 可以指定多个类型
}

const infos: info = {
  a: 1,
  b: '2',
  c: true, // error 类型不匹配
}

以及在新的版本中更推荐使用内置函数Record来实现:

const infos: Record<string, string | number> = {
  a: 1,
  b: '2',
  c: true, // error
}

获取变量的类型

假如我们有一个JSON对象,里边包含了nameage两个属性,我们可以通过一些TypeScript内置的工具函数来实现一些有意思的事情。

通过keyoftypeof组合可以得到我们想要的结果:

const obj = {
  name: 'Niko',
  age: 18
}

// 如果是这样的取值,只能写在代码中,不能写在 d.ts 文件中,因为声明文件里边不能存在实际有效的代码
type keys = keyof typeof obj

let a: keys = 'name' // pass
let b: keys = 'age'  // pass

let c: keys = 'test' // error

而如果我们想要将一个类型不统一的JSON修改为统一类型的JSON也可以使用这种方式:

const obj = {
  name: 'Niko',
  age: 18,
  birthday: new Date()
}

const infos: Record<keyof typeof obj, string> = {
  name: '',
  age: '',
  birthday: 123, // 出错,提示类型不匹配
  test: '', // 提示不是`info`的已知类型
}

获取函数的返回值类型

又比如说我们有一个函数,函数会返回一个JSON,而我们需要这个JSON来作为类型。

那么可以通过ReturnType<>来实现:

function func () {
  return {
    name: 'Niko',
    age: 18
  }
}

type results = ReturnType<typeof func>

// 或者也可以拼接 keyof 获取所有的 key
type resultKeys = keyof ReturnType<typeof func>

// 亦或者可以放在`Object`中作为动态的`key`存在
type infoJson = Record<keyof ReturnType<typeof func>, string>

在代码中声明函数和class类型

因为我们知道函数和class在创建的时候是都有实际的代码的(函数体、构造函数)。
但是我们是写在d.ts声明文件中的,这只是一个针对类型的约束,所以肯定是不会存在真实的代码的,但是如果在普通的ts文件中这么写会出错的,所以针对这类情况,我们需要使用declare关键字,表示我们这里就是用来定义一个类型的,而非是一个对象、函数:

class Personal {
  name: string
  // ^ 出错了,提示`name`必须显式的进行初始化
}

function getName (personal: Personal): name
// ^ 出错了,提示函数缺失实现

以下为正确的使用方式:

-declare class Personal {
+declare class Personal {
  name: string
}

-function getName (personal: Personal): name
+declare function getName (personal: Personal): name

当然了,一般情况下是不建议这么定义class的,应该使用interface来代替它,这样的class应该仅存在于针对非TS模块的描述,如果是自己开发的模块,那么本身结构就具有声明类型的特性。

函数重载

这个概念是在一些强类型语言中才有的,依托于TypeScript,这也算是一门强类型语言了,所以就会有需要用到这种声明的地方。

例如我们有一个add函数,它可以接收string类型的参数进行拼接,也可以接收number类型的参数进行相加。

需要注意的是,只有在做第三方插件的函数重载定义时能够放到d.ts文件中,其他环境下建议将函数的定义与实现放在一起(虽说配置paths也能够实现分开处理,但是那样就失去了对函数创建时的约束)

// index.ts

// 上边是声明
function add (arg1: string, arg2: string): string
function add (arg1: number, arg2: number): number
// 因为我们在下边有具体函数的实现,所以这里并不需要添加 declare 关键字

// 下边是实现
function add (arg1: string | number, arg2: string | number) {
  // 在实现上我们要注意严格判断两个参数的类型是否相等,而不能简单的写一个 arg1 + arg2
  if (typeof arg1 === 'string' && typeof arg2 === 'string') {
    return arg1 + arg2
  } else if (typeof arg1 === 'number' && typeof arg2 === 'number') {
    return arg1 + arg2
  }
}

TypeScript 中的函数重载也只是多个函数的声明,具体的逻辑还需要自己去写,他并不会真的将你的多个重名 function 的函数体进行合并

多个函数的顺序问题

想象一下,如果我们有一个函数,传入Date类型的参数,返回其unix时间戳,如果传入Object,则将对象的具体类型进行toString输出,其余情况则直接返回,这样的一个函数应该怎么写?

仅做示例演示,一般正常人不会写出这样的函数...

function build (arg: any) {
  if (arg instanceof Date) {
    return arg.valueOf()
  } else if (typeof arg === 'object') {
    return Object.prototype.toString.call(arg)
  } else {
    return arg
  }
}

但是这样的函数重载在声明的顺序上就很有讲究了,一定要将精确性高的放在前边:

// 这样是一个错误的示例,因为无论怎样调用,返回值都会是`any`类型
function build(arg: any): any
function build(arg: Object): string
function build(arg: Date): number

因为TypeScript在查找到一个函数重载的声明以后就会停止不会继续查找,any是一个最模糊的范围,而Object又是包含Date的,所以我们应该按照顺序从小到大进行排列:

function build(arg: Date): number
function build(arg: Object): string
function build(arg: any): any

// 这样在使用的时候才能得到正确的类型提示
const res1 = build(new Date()) // number
const res2 = build(() => { })  // string
const res3 = build(true)       // any

一些不需要函数重载的场景

函数重载的意义在于能够让你知道传入不同的参数得到不同的结果,如果传入的参数不同,但是得到的结果(类型)却相同,那么这里就不要使用函数重载(没有意义)。

如果函数的返回值类型相同,那么就不需要使用函数重载

function func (a: number): number
function func (a: number, b: number): number

// 像这样的是参数个数的区别,我们可以使用可选参数来代替函数重载的定义
function func (a: number, b?: number): number
// 注意第二个参数在类型前边多了一个`?`

// 亦或是一些参数类型的区别导致的
function func (a: number): number
function func (a: string): number

// 这时我们应该使用联合类型来代替函数重载
function func (a: number | string): number

Interface

interface是在TypeScript中独有的,在JavaScript并没有interface一说。
因为interface只是用来规定实现它的class对应的行为,没有任何实质的代码,对于脚本语言来说这是一个无效的操作

在语法上与class并没有什么太大的区别,但是在interface中只能够进行成员属性的声明,例如function只能够写具体接收的参数以及返回值的类型,并不能够在interface中编写具体的函数体,同样的,针对成员属性也不能够直接在interface中进行赋值:

// 这是一个错误的示例
interface PersonalIntl {
  name: string = 'Niko'

  sayHi (): string {
    return this.name
  }
}

// 在 interface 中只能存在类型声明
interface PersonalIntl {
  name: string

  sayHi (): string
}

其实在一些情况下使用interface与普通的type定义也没有什么区别。
比如我们要导出一个存在nameage两个属性的对象:

// types/personal.d.ts
export interface PersonalIntl {
  name: string
  age:  number
}

// index.d.ts
import { PersonalIntl } from './types/personal'

const personal: PersonalIntl = {
  name: 'Niko',
  age:  18,
}

如果将interface换成type定义也是完全没问题的:

// types/personal.d.ts
export type PersonalIntl = {
  name: string
  age:  number
}

这样的定义在基于上边的使用是完全没有问题的,但是这样也仅仅适用于Object字面量的声明,没有办法很好的约束class模式下的使用,所以我们采用interface来约束class的实现:

import { PersonalIntl } from './types/personal'

class Personal implements PersonalIntl {
  constructor(public name: string, public age: number) { }

  // 上边的简写与下述代码效果一致

  public name: string
  public age: number

  constructor (name: string, age: number) {
    this.name = name
    this.age = age
  }
}

const personal = new Personal('niko', 18)

关于函数成员声明的一些疑惑

首先,在接口中有两种方式可以定义一个函数,一个被定义在实例上,一个被定义在原型链上。
两种声明方式如下:

interface PersonalIntl {
  func1 (): any      // 实例属性

  func2: () => any   // 原型链属性
}

但是我们在实现这两个属性时其实是可以互相转换的,并没有强要求必须使用哪种方式:

class Personal implements PersonalIntl {
  func1 () {
    console.log(this)
  }

  func2 = () => {
    console.log(this)
  }
}

其实这两者在编译后的JavaScript代码中是有区别的,并不清楚这是一个bug还是设计就是如此,类似这样的结构:

var Personal = /** @class */ (function () {
    function Personal() {
        var _this = this;
        this.func2 = function () {
            console.log(_this);
        };
    }
    Personal.prototype.func1 = function () {
        console.log(this);
    };
    return Personal;
}());

所以在使用的时候还是建议最好按照interface定义的方式来创建,避免一些可能存在的奇奇怪怪的问题。

接口声明的自动合并

因为interfaceTypeScript特有的,所以也会有一些有意思的特性,比如相同命名的interface会被自动合并:

interface PersonalIntl {
  name: string
}

interface PersonalIntl {
  age: number
}

class Personal implements PersonalIntl {
  name = 'Niko'
  age = 18
}

不要在 interface 中使用函数重载

interface中使用函数重载,你会得到一个错误的结果,还是拿上边的build函数来说,如果在interface中声明,然后在class中实现,那么无论怎样调用,返回值的类型都会认为是any

所以正确的做法是在class中声明重载,在class中实现,interface中最多只定义一个any,而非三个重载。

class Util implements UtilIntl {
  build(arg: Date): number
  build(arg: Object): string
  build(arg: any): any

  build(arg: any) {
    if (arg instanceof Date) {
      return arg.valueOf()
    } else if (typeof arg === 'object') {
      return Object.prototype.toString.call(arg)
    } else {
      return arg
    }
  }
}

小结

有关TypeScript声明类型声明相关的目前就总结了这些比较常用的,欢迎小伙伴们进行补充。

在之前的版本中有存在modulenamespace的定义,但是目前来看,好像更推荐使用 ES-Modules 版本的 import/export来实现类似的功能,而非自定义的语法,所以就略过了这两个关键字相关的描述

官方文档中有针对如何编写声明文件的模版,可以参考:传送阵

参考资料

目录
相关文章
|
5天前
|
人工智能 自然语言处理 文字识别
阿里云百炼Qwen3.7-Max简介:能力、优势、支持订阅计划参考
Qwen3.7-Max是阿里云百炼面向智能体时代推出的新一代旗舰模型,对标GPT-5.5、Claude Opus 4.7等闭源旗舰。该模型支持百万级token上下文窗口,具备顶级推理能力、多模态搜索与视觉理解增强、流式输出低延迟响应等核心优势,覆盖编程、办公、长周期自主执行等复杂场景。同时支持OpenAI接口兼容,便于系统快速迁移。用户可通过Token Plan团队或节省计划等订阅方式灵活调用,适合企业级高要求场景使用。
8552 37
阿里云百炼Qwen3.7-Max简介:能力、优势、支持订阅计划参考
|
4天前
|
缓存 测试技术 API
Qwen 3.7 Plus 与 Max 实测:性价比与多模态能力差异解析(2026)
2026 年 6 月 1 日,阿里悄无声息地发布了 Qwen 3.7 Plus,距 Qwen 3.7 Max 上线刚好 11 天。同样的 1M 上下文,同样的 35 小时自治上限。但价格才是头条:Plus 是 0.40/M输入,Max是 2.50/M——便宜约 6 倍——并且还能看图、看视频。Vision Arena 上 Plus 已经排到 #16。所以这周真正值得讨论的问题不是”要不要为视觉能力买单”,而是”Max 凭什么用 6 倍价格换来 2 个百分点的 benchmark 领先”。
|
5天前
|
JavaScript 定位技术 API
CodeGraph 爆火:编程 Agent 需要的不是更多上下文,而是一张提前画好的代码地图
CodeGraph 是一款爆火的本地代码智能工具,通过 tree-sitter 解析 AST 构建结构化知识图谱(存于 SQLite),为编程 Agent 提前生成“代码地图”。它显著降低 Agent 在中大型项目中的探索成本——实测工具调用减少71%、Token 降57%、速度提升46%,支持19+语言及主流框架路由识别,完全离线、无需 API Key。
634 3
CodeGraph 爆火:编程 Agent 需要的不是更多上下文,而是一张提前画好的代码地图
|
5天前
|
人工智能 运维 JavaScript
阿里云Qoder CN(原通义灵码)全解析 产品形态、版本划分与技术适配说明
在AI辅助开发与智能办公工具持续普及的当下,阿里云旗下原通义灵码正式更名为Qoder CN,同时延伸出QoderWork CN、Qoder CN CLI、Qoder CN Mobile等多款配套产品,形成覆盖代码开发、日常办公、终端交互、移动端使用的完整工具矩阵。Qoder CN核心定位为AI智能编码助手,深度适配主流代码编辑器、集成开发环境以及终端场景;QoderWork CN则偏向桌面端综合办公辅助,二者面向不同使用场景,划分了多个版本档位,搭配差异化资源配额、功能权限与计费规则,同时兼容多款主流大模型。
633 5
|
5天前
|
数据采集 人工智能 前端开发
让 Coding Agent 从黑盒到透明:阿里云 Agent 观测审计数据采集实践
AI Agent 规模化落地带来执行黑盒、行为难追溯、成本难度量三大难题。阿里云基于 OTel 标准,面向 Coding Agent、个人通用助理和框架型 Agent,推出 LoongSuite Pilot、插件及探针等无侵入采集方案,让 Agent 实现可看见、可分析、可审计、可治理。
716 148
|
5天前
|
人工智能 缓存 自然语言处理
阿里Qwen3.7-Max评测:Agent能力显著提升,耗时与调用成本大幅下降
阿里云百炼推出面向智能体的旗舰大模型Qwen3.7-Max,具备长周期自主执行能力,显著提升编程、办公自动化等复杂任务处理水平;支持MCP集成与多框架兼容,并以限时5折+100万Tokens免费试用大幅降低使用门槛,助力企业高效落地AI应用。在阿里云百炼平台快速体验:https://t.aliyun.com/U/fPVHqY
1953 10
|
5天前
|
存储 安全 Java
AgentScope Java 2.0:打造分布式、企业级智能体底座
AgentScope 2.0 面向分布式部署、稳定运行、权限安全等企业级需求全面升级,打造支持多租户隔离与长期稳定运行的企业级智能体底座。
|
5天前
|
人工智能 运维 API
2026年阿里云百炼通义千问Qwen3.7-plus深度介绍 功能特性、使用优势及618大促订阅方案指南
大模型技术的普及,让AI能力逐步融入个人办公、内容创作、代码编写、企业运营、教育培训等各类场景。不同定位的模型对应不同使用需求,旗舰级模型性能强劲但使用成本偏高,轻量化模型价格低廉却难以胜任复杂任务,而介于两者之间的中端主力模型,凭借均衡的能力、亲民的定价、广泛的场景适配性,成为绝大多数个人用户、小型团队、中小企业的首选。
757 1
|
5天前
|
人工智能 安全 定位技术
CodeGraph深度解析 让Claude Code工具调用直降七成的核心原理与实操教程
如今以Claude Code为代表的AI编程智能体已经成为开发者日常编码、项目重构、漏洞修复的必备工具。但在长期使用过程中,几乎所有开发者都会遇到同一个明显痛点:AI虽然具备强大的代码生成与分析能力,却常常陷入盲目探索的循环中。
1350 2
|
5天前
|
人工智能 运维 自然语言处理
阿里云百炼Qwen3.7-Max模型详解:综合能力、核心优势与订阅计划参考指南
2026年,大模型技术持续向通用化、高性能、场景化方向迭代,阿里云百炼作为一站式大模型服务平台,持续推出迭代升级的模型产品,Qwen3.7-Max便是当前主力旗舰级大模型之一。该模型依托深度优化的底层架构与大规模训练数据,在文本理解、逻辑推理、多模态交互、代码生成、长文本处理等多个维度实现能力升级,同时搭配灵活的订阅计划体系,能够适配个人开发者、中小企业、大型企业、政企机构等不同类型用户的使用需求。
552 2