javascript - TypeScript 从现有接口(interface)创建新接口(interface)并更改所有属性的类型

Question

interface UserFlags {
  isDev: boolean;
  isAdmin: boolean;
  isMod: boolean;
}

const flagPositions: FlagPositions<UserFlags> = {
  isDev: 0,
  isAdmin: 1,
  isMod: 2,
};

如何实现 FlagPositions 以便它向类型为 { [name: string]: boolean } 的接口(interface)获取 1 个泛型参数，并需要该接口(interface)的所有属性接口(interface)是否存在于新接口(interface)中，但类型为 number？

我使用keyof尝试了各种方法，但没有成功。

编辑:我在发布后得到了这个工作，但我希望它成为一个界面

type FlagPositions<F> = {
  [K in keyof Required<F>]: number;
};

Answer 1

您想要FlagPositions<T>成为mapped type其 key 与 keyof T 相同但其值为 number 。你可以这样写:

type FlagPositions<T> = { [K in keyof T]: number };

并验证它是否按您想要的方式工作:

const flagPositions: FlagPositions<UserFlags> = {
    isDev: 0,
    isAdmin: 1,
    isMod: 2,
};

---

请注意，没有必要 constrain T至{[name: string]: boolean}或Record<keyof T, boolean> ，但如果您愿意，您可以这样做:

type FlagPositions<T extends Record<keyof T, boolean>> =
    { [K in keyof T]: number };


declare const oops: FlagPositions<{ a: number }>; // error!
// ---------------------------->  ~~~~~~~~~~~~~
//   Types of property 'a' are incompatible.

---

你不能创建 FlagPositions<T>一个interface因为接口(interface)需要在编译时知道 key ，并且 T是通用的，可以有各种键。但是一旦你有了FlagPositions<UserFlags>输入具有已知键的类型(它们是 isDev 、 isAdmin 和 isMod )，那么您可以创建 interface扩展:

interface UserFlagPositions extends FlagPositions<UserFlags> { }

const u: UserFlagPositions = {
    isDev: 2,
    isAdmin: 1,
    isMod: 0
}

Playground link to code