TypeScript：Mapped types与Interface能否结合使用？如何实现？

你遇到的报错肯定是写法上的小问题——TypeScript里映射类型完全能和接口配合使用，只是二者的语法规则有差异，导致直接照搬type的写法会触发错误。

先帮你理清楚核心逻辑：映射类型本质是基于泛型的类型变换工具，它的作用就是遍历另一个类型（包括接口）的键并生成新的类型结构。type能直接运行是因为它的语法支持直接定义映射类型，但接口不能直接在内部写[K in keyof T]这种遍历语法，不过我们可以通过两种方式解决：

方式1：接口继承映射类型的实例 #

先定义通用的映射类型，再让接口继承这个映射类型针对目标接口生成的实例：

// 你的目标接口
interface User {
  name: string;
  age: number;
}

// 定义一个通用的映射类型
type Mapped<T> = {
  // 遍历传入类型的所有键
  [K in keyof T]: T[K];
};

// 让接口继承映射后的类型
interface MappedUser extends Mapped<User> {}
// 此时MappedUser的结构和User完全一致，还能额外扩展属性
interface MappedUser extends Mapped<User> {
  isVerified: boolean;
}

方式2：泛型接口直接使用映射语法 #

如果你需要更灵活的泛型支持，可以直接定义一个泛型接口，内部使用映射类型：

// 泛型接口内部直接用映射遍历传入的类型
interface GenericMapped<T> {
  [K in keyof T]: T[K];
}

// 使用时传入你的接口类型
type MappedUser = GenericMapped<User>;

为什么直接在接口里写映射会报错？ #

这是TypeScript的语法规则限制：接口的顶层成员只能是明确的属性名或者常规索引签名（比如[key: string]: any），而[K in keyof T]属于泛型遍历的特殊语法，只能在type或者泛型接口的内部使用，不能直接放在非泛型接口的顶层。

常见实用场景 #

除了单纯复制接口结构，你还可以用映射类型给接口做各种变换：

• 把所有属性变成只读：

  type ReadonlyMapped<T> = {
    readonly [K in keyof T]: T[K];
  };
  interface ReadonlyUser extends ReadonlyMapped<User> {}
  

• 把所有属性变成可选：

  type PartialMapped<T> = {
    [K in keyof T]?: T[K];
  };
  interface PartialUser extends PartialMapped<User> {}
  

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