【TypeScript】interfaceをオーバライドするには？

以下のような、オーバーライドをしようとすると

interface A {
  x: string
  y: number
}

interface B extends A {
  x: number
}

以下のようなエラーメッセージが表示されました。

TS2430: Interface 'B' incorrectly extends interface 'A'.
  Types of property 'x' are incompatible.
    Type 'number' is not assignable to type 'string'.

要約すると、「もともとstring型のxにnumber型で上書きはダメだよ」みたいな感じだと思います。

目次

対処法

何はともあれ、グーグル先生に聞いたところ、以下のページが引っかかりました。

対策は以下の通り

interface A {
  x: string
  y: number
}

interface B extends Omit<A, 'x'> {
  x: number
}

元のコードとの違いは、継承部分でOmitを使ってプロパティxを除外しているところで、プロパティxを一旦除外して再度プロパティxを再定義という形で対処されています。

参考ページ

Omitについては、以下の解説がシンプルでわかりやすいです。