타입스크립트 이해하기

서로소 유니온 타입

교집합이 없는 타입들로만 만든 유니온 타입

동시에 여러가지 상태를 표현해야 하는 객체의 타입을 정의할 때는 선택적 프로퍼티를 사용하는 것보다는 상태에 따라서 타입을 잘개 쪼개서 서로소 유니온 타입으로 만들어주자!

• 그 이유는??
  switch case 문 같은 것을 이용했을 때 더 직관적이고 안전하게 타입을 좁혀서 코드를 만들 수 있기 때문이다.

  // 비동기 작업의 결과를 처리하는 객체
  type LoadingTask = {
     state: "LOADING"
  }
  type FailedTask = {
     state: "FAILED";
     error: {
         message: string;
     }
  }
  type SuccessTask = {
     state: "SUCCESS";
     response: {
         data: string;
     }
  }
  type AsyncTask = LoadingTask | FailedTask | SuccessTask;

  // 로딩 중 => 콘솔에 로딩중 출력
  // 실패 => 실패 : 에러메시지를 출력
  // 성공 => 성공 : 데이터를 
  function processResult(task:AsyncTask) {
     switch(task.state) {
         case 'LOADING' : {
             console.log("로딩 중");
             break;
         }
         case 'FAILED' : {
             console.log(`에러 발생 : ${task.error.message}`);
             break;
         }
         case "SUCCESS" : {
             console.log(`성공 : ${task.response.data}`);
             break;
         }
     }
  }

  const loading: AsyncTask = {
     state: "LOADING",
  };
  const failed: AsyncTask = {
     state: "FAILED",
     error: {
         message: "오류 발생 원인은 ~~",
     },
  };
  const success: AsyncTask = {
     state: "SUCCESS",
     response: {
         data: "데이터 ~~",
     },
  };