当前位置: 首页 > news >正文

TypeScript 中interface和type的区别?

在 TypeScript 中,interface 和 type 都用于定义自定义类型,但它们有一些关键区别:

1. 主要区别

1.1. 语法差异

interface 使用 interface 关键字。

interface Person {
  name: string;
  age: number;
}

type 使用 type 关键字。

type Person = {
  name: string;
  age: number;
};

1.2. 扩展方式

interface 使用 extends 扩展。

interface Animal {
  name: string;
}

interface Dog extends Animal {
  breed: string;
}

type 使用交叉类型 & 扩展。

type Animal = {
  name: string;
};

type Dog = Animal & {
  breed: string;
};

1.3. 合并声明

interface 支持声明合并,相同名称的接口会自动合并。

interface User {
  name: string;
}

interface User {
  age: number;
}

// 最终 User 包含 name 和 age

type 不允许重复声明,会报错

2. 功能差异

2.1. type 能做而 interface 不能的

定义基本类型别名。

type ID = string | number;

定义元组类型。

type Point = [number, number];

使用 typeof 获取实例类型。

const person = { name: 'Alice', age: 30 };
type Person = typeof person;

2.2. interface 的优势

1. 更好的错误提示信息(通常更清晰);

2. 更适合面向对象编程,特别是与类一起使用时;

3. 声明合并特性在某些场景下非常有用(如扩展第三方库类型);

3. 使用建议

1. 优先使用 interface,除非需要 type 的特定功能;

2. 需要联合类型、元组或映射类型时使用 type;

3. 需要扩展第三方类型或需要声明合并时使用 interface;

4. 在库或公共 API 定义中使用 interface,因为它更易扩展;

两者在大多数情况下可以互换,选择主要取决于具体需求和团队约定。

相关文章:

  • SDL视频显示函数
  • 数据倾斜:分布式系统中的性能杀手与应对之道
  • React Context API 用于在组件树中共享全局状态
  • Go 学习笔记 · 进阶篇 · 第一天:接口与多态
  • SH 和 BASH 有什么不同 ?
  • Spring Boot 2.6.15 + MyBatis-Plus 3.5.1 升级至 3.3.2 + 3.5.7 全流程指南
  • C++——析构函数
  • ide技术
  • CANoe CAPL——TCP/IP函数
  • 基于内容的课程推荐网站的设计与实现00(SSM+htmlL)
  • Vue3 数据流革命:单项数据流与 defineModel 的深度解析
  • 【Leetcode 每日一题】368. 最大整除子集
  • 设计模式简述(十一)装饰器模式
  • Android studio局域网屏幕共享(旧手机可以用来当监控啦)
  • 虚幻5学习笔记,疑点
  • 力扣刷题-热题100题-第32题(c++、python)
  • 玩转大语言模型——使用华为官方MindIE-Server镜像方式部署DeepSeek模型
  • 编程基础 0 到 1 1768. 交替合并字符串
  • 蓝桥杯 日期统计(刷题笔记)
  • C++多线程编码二
  • 西安专业网站开发公司/查指数
  • vue单页面做网站加载慢/新媒体运营培训学校
  • 在线免费开网站/如何提升网站搜索排名
  • 上海静安网站建设/seo建站营销
  • 哪款地图可以看到实时街景/合肥seo公司
  • 建平台跟建网站/搜狗网页版入口