如何在TypeScript中覆盖类型属性

Question

例如，我有

type Line = {
  start: Point;
  end: Point;
  color: string; //'cyan'/'aquablue'/...
}

但是现在我想在Line的基础上创建新的线型，以便将颜色存储为数字：

type HexColorLine = Point & {
  color: number;
}

现在我希望HexColorPoint类型等于

{
  start: Point;
  end: Point;
  color: number;
}

但这等于

{
  start: Point;
  end: Point;
  color: string | number;
}

有没有一种方法可以使用一些简短的语法覆盖但不扩展prop类型？我真的需要为此定义全新的类型吗？

Answer 1

从 TypeScript 3.5 开始，一个简单的一次性解决方案可能是：

type HexColorLine = Omit<Line, 'color'> & {
  color: number;
}

Answer 2

在 TypeScript 3.5 或更高版本中，您可以使用Omit<Type, Keys>.

对于类型：

type HexColorPoint = Omit<Line, "color"> & {
    color: number;
}

对于接口：

interface HexColorPoint extends Omit<Line, "color"> {
    color: number;
}

Answer 3

要扩展Pablo使用 Omit 的答案，您可以执行以下操作来创建更通用的实用程序类型。

type Overwrite<Base, Overrides> = Omit<Base, keyof Overrides> & Overrides


type HexColorLine = Overwrite<Line, { color: number }>

Overrides这会从类型中省略所提供类型中的所有键Base，然后将其与所提供的组合起来Overrides。

Answer 4

创建一个助手类型：

type Overwrite<T, U> = Pick<T, Exclude<keyof T, keyof U>> & U;

用法：

type HexColorLine = Override<Line, { color: number }>

Answer 5

使固定

创建一个基本类型：

type LineBase = {
  start: Point;
  end: Point;
}
type LineBase = LineBase & {
  color: string; //'cyan'/'aquablue'/...
}