필수 타입! Discriminated Union

차별화(구분) 할 수 있는 Union

 

아래 코드를 개선해보자

type SuccessState = {
  response: {
    body: string;
  };
};

type FailState = {
  reason: string;
};

type LoginState = SuccessState | FailState;


function login(): SuccessState | FailState {
  return {
    response: {
      body: "logged in!",
    },
  };
}

function printLoginState(state: LoginState) {
  if ("response" in state) {
    console.log(`🎉 ${state.response.body}`);
  } else {
    console.log(`😭 ${state.reason}`);
  }
}
let 입장: SuccessState = {
  response: {
    body: "입장완료!",
  },
};

printLoginState(입장); //🎉 입장완료!

 

유니온 타입을 사용할 때, 어떤 케이스든 공통 프로퍼티를 가지고 있음으로서 조금 더 구분하게 쉽게 만들어주자.

아래와 같이

type SuccessState = {
  result: "success";
  response: {
    body: string;
  };
};

type FailState = {
  result: "fail";
  reason: string;
};

type LoginState = SuccessState | FailState;

function login(): SuccessState | FailState {
  return {
    result: "success",
    response: {
      body: "logged in!",
    },
  };
}

function printLoginState(state: LoginState) {
  if (state.result == "success") {
    console.log(`🎉 ${state.response.body}`);
  } else {
    console.log(`😭 ${state.reason}`);
  }
}
let 입장: SuccessState = {
  result: "success",
  response: {
    body: "입장완료!",
  },
};

printLoginState(입장); //🎉 입장완료!