typescriptの交差(インターセクション)型と共用体型(ユニオン)型

交差(インターセクション)型

複数の型を&でまとめたもの。

例)

type Type1 = {
    name: string
    age: number
}

type Type2 = {
    age: number
    hobby: string
}

type Type3 = Type1 & Type2 // `Type1`と`Type2`を `&` でまとめる。

const testObj:Type3 = {
    name: "test",
    age: 32,
    hobby: "basketball"
}

上記の例で、Type1ではnameageのプロパティがあり、Type2ではagehobbyのプロパティがある。
共通で持っているプロパティはageのみ。
この二つを'&'でまとめたType3の型は以下の通りになる。

type Type3 = {
    name: string
    age: number
    hobby: string
}

なお、共通のプロパティがあるが型が異なる場合はどうなるか。

type Type1 = {
    name: string
    age: number
}

type Type2 = {
    name: string
    age: string
    hobby: string
}

type Type3 = Type1 & Type2

const testObj:Type3 = {
    name: "test",
    age: 32,  // 絶対あり得ない型になるため`naver`エラーになる。
    hobby: "basketball"
}

では、共通するプロパティの片方の型がユニオン型だとどうなるだろう。
正解は、共通する方のみが採用される。

type Type1 = {
    name: string
    age: number
}

type Type2 = {
    name: string
    age: number | string
    hobby: string
}

type Type3 = Type1 & Type2

const testObj:Type3 = {
    name: "test",
    age: 32,
    hobby: "basketball"
}

上記の例だと、Type3ageの型はnumberのみに共有しているので、numberのみになる。

共用体型(ユニオン)型

複数の型を|で区切ってorを表現したもの。

type Type1 = {
    name: string
    age: number
}

type Type2 = {
    age: number
    hobby: string
}

type Type3 = Type1 | Type2 // `|`で区切って`or`を表現

const testObj:Type3 = {
    age: 32,
    hobby: "basketball"
}

ここでType3の型は、Type1もしくはType2になる。
よって、testObjType1もしくはType2の型に合致すれば、エラーは出ない。
逆にType1にもType2にも合致しなかった場合は、エラーになる。
例)

type Type1 = {
    name: string
    age: number
}

type Type2 = {
    age: number
    hobby: string
}

type Type3 = Type1 | Type2

const testObj:Type3 = { // `Type1`と`Type2`2は`age`のプロパティがあるが、`testObj`にはないためエラーになる
    name: "test",
    hobby: "basketball"
}

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です