TypeScriptでは、インターフェースの宣言が同じ名前で複数回行われた場合、それらのインターフェースは結合されます。この記事では、同じ名前のインターフェースがどのように結合されるのかを説明します。
基本的なインターフェースの宣言
まず、以下のように基本的なインターフェースを宣言します。このインターフェースPersonは、nameというプロパティを持つオブジェクトを定義します。
interface Person {
name: string
}
このインターフェースを基に、nameプロパティを持つPerson型のオブジェクトを作成できます。
同じ名前で別のインターフェースを追加する
ここで、同じ名前Personで別のインターフェースを宣言し、ageという新しいプロパティを追加してみます。
interface Person {
age: number
}
TypeScriptでは、同じ名前のインターフェースが宣言されると、これらは結合されます。つまり、Person型はnameとageの両方のプロパティを持つようになります。
結合されたインターフェースを使用する
インターフェースが結合された結果、以下のようにPerson型のオブジェクトはnameとageの両方のプロパティを持つことができます。
const person: Person = {
age: 22,
name: 'Bob'
}
このように、同じ名前のインターフェースを複数回宣言すると、プロパティが結合され、より豊かな型定義が可能になります。
TypeScriptのインターフェース結合機能は、柔軟で強力な型定義を行う際に非常に便利です。TypeScriptのPlaygroundで実際の例を確認することもできます。
【ご案内】フリーランスエンジニア必見！
最後に、フリーランスエンジニアの方にご案内です。
あなたに今だけご紹介できる”エンド直”・”高単価”の案件があります！
気になる方は公式ラインの追加をお願いします👇
https://s.lmes.jp/landing-qr/2005758918-ADDegZkx?uLand=tau44P