对象类型定义方式对比

考察点分析 link

该题目主要考察以下核心能力维度：

1. TypeScript类型系统理解：对类型定义基础语法的掌握程度
2. 类型工具辨析能力：区分interface和type在不同场景下的适用性
3. 细节特性把控：可选属性和只读属性等高级类型特性的正确使用

具体评估点包括：

• 对象类型声明语法差异
• 可选属性（Optional Properties）定义规范
• 只读属性（Readonly Modifier）实现方式
• interface声明合并特性认知
• type扩展联合类型能力

技术解析 link

关键知识点 link

Interface基本类型声明 > Type类型别名声明 > 声明合并特性 > 扩展能力差异

1. 基础定义 link

  // Interface方式
interface Person {
  name: string
  age: number
}

// Type方式
type Person = {
  name: string
  age: number
}
  

2. 可选属性 link

两者均使用?:语法：

  interface Person {
  name: string
  age?: number // 可选属性
}

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

3. 只读属性 link

均使用readonly修饰符：

  interface Person {
  readonly id: number
  name: string
}

type Person = {
  readonly id: number
  name: string
}
  

常见误区 link

1. 错误认为interface和type语法存在本质差异（实际在对象类型定义时语法一致）
2. 混淆类型扩展方式（interface用extends，type用交叉类型）
3. 过度使用type定义对象类型（不符合TS官方推荐规范）

问题解答 link

通过interface和type定义包含name和age属性的对象类型语法完全一致，两者在可选属性和只读属性的定义语法上也没有差异。主要区别体现在类型系统的其他特性中：

相同点：

• 对象结构定义语法相同
• 均支持?:声明可选属性
• 均支持readonly修饰符

核心差异：

1. interface支持声明合并，重复声明会自动合并
2. type可定义联合类型、元组等复杂类型
3. 官方推荐interface定义对象类型，type用于类型别名

  // 声明合并示例
interface User { name: string }
interface User { age: number }
// 最终合并为 { name: string; age: number }

// Type无法重复声明
type User = { name: string }
type User = { age: number } // 报错
  

深度追问 link

1. 何时应该优先使用interface？

需要声明合并或定义对象类型时

2. type如何实现继承？

使用交叉类型：type Admin = Person & { permissions: string[] }

3. readonly与const的区别？

const处理变量，readonly处理属性