Union Type(Union Type)とIntersection Type

1つ以上のタイプをパラメータまたは変数に使用できます.

Union Typeの例

function logMessage(value: string){
    console.log(value)
}

logMessage('hello');
logMessage(100); // number 타입이 들어오기에 오류
// 숫자를 포함시키고 싶으면 string -> any 로 바꾸면 된다. <- 타입의 장점이 없어 집니다.

ユニオンタイプを使うと?

function Message(value: string | number){
    console.log(value);
}

Message('hello');
Message(100) // 두 가지 타입 모두 받을 수 있습니다.

使用方法

|キーワードの使用

次の3つのうちの1つを見てください.

let hyunho: string | number | boolean;

Unionタイプのメリット

タイプ防御効果

≪タイプ保護｜Type Protection｜ldap≫:タイプ範囲を特定のタイプ(フィルタ)に縮小するプロセス

function Message(value: string | number){
    if(typeof value === 'number'){
        value.toLocaleString 
        // 각 타입에 맞게 추론이 되기 떄문에 해당 타입의 API 를 사용할 수 있게 됩니다.
        // 타입 가드 : 특정 타입으로 타입의 범위를 좁혀나가는(필터링 하는) 과정
    }

    if(typeof value === 'string'){
        value.toString();
    }

    throw new TypeError('value must be string or number');
}

Message('hello');
Message(100)

Unionタイプフィーチャー

interface Developer{
    name: string;
    skill: string;
}

interface Person{
    name: string;
    age: number;
}

function askSomeone(someone: Developer | Person){
    someone.name
    // someone.skill 불가능
}

開発者とPersonが所有するすべてのプロパティが使用できると思います.

実際には、nameしか利用できません.

なぜなら、誰かにどのような価値をもたらすか分からないので、開発者でなければなりません.Personでなければなりません.

すなわち、タイプスクリプトはコードにエラーが発生する可能性があると考えられているため、インタフェースまたは特定の構造を使用して汎用タイプとして保護された属性しか提供できません.

Intersection Type

&キーワードの使用

あ~同時に、下を見ると3種類全て満足の

let capt: stirng & number & boolean;

断面タイプフィーチャー

interface Developer{
    name: string;
    skill: string;
}

interface Person{
    name: string;
    age: number;
}

function askSomeone(someone: Developer & Person){
    someone.name;
    someone.skill;
    someone.age;
}

開発者とPersone属性のスタッフが含まれています.

共通属性しか使用できないUnionタイプとの違い

UnionとInter部分の違い(呼び出しの観点)

Union Type

function askSomeone(someone: Developer | Person){
}

askSomeone({name: '디벨로퍼', skill: '웹 개발'})
askSomeone({name: '캡틴', age: '100'})

askSomeoneの1つのパラメータは、開発者またはPersonであるため、データの1つを与えるだけでよい.

Intersection Type

function askSomeone(someone: Developer & Person){  
}

// 에러
askSomeone({name: '디벨로퍼', skill: '웹 개발'})
// 이유는 Developer 의 속성과 Persone 의 속성을 모두 넘겨야 합니다.

// 아래와 같이 사용
askSomeone({name: '디벨로퍼', skill: '웹 개발', age: 34})

リファレンス

インフラストラクチャ

板橋隊長