Angular中Type与Interface差异：为何接口报错类型却正常？

核心原因：interface与type的声明合并特性差异 #

Angular HttpClient的params参数要求传入的对象符合带索引签名的结构（本质是Record<string, string | number | boolean | null | undefined>这类类型），它对对象的键值类型有明确约束。而interface和type在TypeScript中的特性差异，导致了兼容性结果不同：

1. interface导致报错的原因 #

TypeScript的interface支持声明合并——你可以在代码不同位置多次声明同一个interface，TypeScript会自动合并所有属性。比如：

// 初始定义
interface PaginationParams {
  page: number;
  size: number;
}
// 后续可能的扩展
interface PaginationParams {
  name: string;
}

合并后的PaginationParams会包含name属性，而这个属性的类型不符合params的要求。因为TypeScript无法预知你后续会不会添加不兼容的属性，所以当你把没有索引签名的interface对象传给params时，会触发类型不兼容报错。

2. type解决问题的原因 #

type是封闭的类型定义，不支持声明合并。一旦你定义了：

type PaginationParams = {
  page: number;
  size: number;
}

这个类型的结构就完全固定，不会被后续代码修改。TypeScript可以明确确认该类型的所有属性都符合params的类型要求，因此会自动将其视为与带索引签名的目标类型兼容，不需要额外添加索引签名，同时还能保持类型安全——因为type本身就限制了只能有你定义的那几个属性。

3. 为什么添加索引签名会破坏类型安全 #

给interface添加[key: string]: number这类索引签名后，意味着允许任何字符串键的数值类型属性存在。比如你可以给PaginationParams对象随意添加random: 123这类多余属性，TypeScript不会报错，但这些属性会被带到Http请求中，破坏了原本的类型约束。

内容的提问来源于stack exchange，提问作者Fu Chang