TypeScript #5 리터럴, 유니온/교차 타입

// Literal Types

const userName1 = "Bob" // userName1에 마우스를 올려보면 "Bob"이라고 나온다. 변화할 수 없으니 Bob이외의 값은 넣을 수 없다.
// userName1처럼 정해진 string값을 가진 것을 문자열 리터럴 타입이라고 한다.
let userName2 = "Tom" // 반면 userName2는 언제든 변화할 수 있으니 넓은 개념의 string타입으로 정의된다.

userName2 = 3 // string타입이므로 에러가 난다

let userName3: string | number = "Andy"
userName3 = 3 // 숫자도 넣을 수 있게 해주려면 명시적으로 작성해 주어야 한다.

type Job = "police" | "developer" | "teacher";

interface User {
    name : string;
    job : Job;
}

const user:User = {
    name : "Bob",
    job : "developer" // Job에 있는 요소들만 넣을 수 있다.
}

interface HighSchoolStudent {
    name: number | string;
    grade: 1 | 2 | 3; // | 이 기호를 사용하는 타입을 유니온 타입이라고 한다.
}

// Union types

interface Car {
    name: "car"
    color: string
    start(): void;
}

interface Mobile {
    name: "mobile"
    color: string
    call(): void
}

function getGift(gift: Car | Mobile) {
    console.log(gift.color); // color는 Car와 Mobile 두 곳 다 있어서 사용할 수 있다

    gift.start(); // Car에만 start가 들어있어서 에러가 나온다.

    if(gift.name === "car") {
        gift.start();
    } else {
        gift.call();
    } // if문을 이용해 car인지 mobile인지 확인 후에 알맞은 함수를 사용할 수 있다.
      // 확인해야 하는 것이 많아지면 switch문을 사용하면 된다.
      // 이렇게 동일한 타입의 속성을 다르게 해서 구분할 수 있는 것을 식별 가능한 유니온 타입이라고 한다.
}

// Intersection Types 교차 타입 and를 의미

interface Car2 {
    name: string;
    start(): void;
}

interface Toy {
    name: string;
    color: string;
    price: number;
}

const toyCar: Toy & Car2 = { // 이렇게 &로 타입을 설정하면 두 개의 인터페이스의 모든 타입을 기입해 줘야 한다.
    name: "타요",
    start() {},
    color: "blue",
    price: 1000,
}; 
// 교차타입은 여러개의 타입을 하나로 합쳐주는 역할을 한다. 그래서 필요한 모든 기능을 가진 하나의 타입이 만들어 진다.