[TS] 타입 추론

minjeong·2024년 9월 30일
post-thumbnail

타입스크립트는 타입을 명시해줘야 합니다.
이때 여러개의 타입 각각 어떻게 타입을 명시해줘야 하는지 간단하게 정리해보려 합니다.

타입 추론

타입 추론은 코드에서 명시적으로 타입을 지정하지 않아도, 타입스크립트가 자동으로 변수나 함수의 타입을 추측해내는 기능을 말합니다. 즉, 개발자가 명시적으로 타입을 지정하지 않아도, 타입스크립트는 코드를 분석하여 가능한 타입을 추론해주는 꽤나 편리한 기능이죠.

여러 예시를 보고 한꺼번에 설명해볼까 합니다!

const TypescriptExample = () => {
  //타입 추론
  let aaa = '안녕하세요'; // let aaa: string 으로 자동으로 타입이 추론됩니다.
  aaa = 3; // error : 이렇게 되면 이미 aaa는 string으로 지정되어있기에 숫자를 넣을 수 없습니다.

  //타입명시
  let bbb: string = 'hello';
  bbb = 10; //error : string으로 이미 명시를 해버려서 에러가 발생합니다.

  //타임명시가 필요한 상황 : 타입이 두가지 이상을 가질 수 있는 경우
  let ccc: number | string = 1000;
  ccc = '1000원';

  //숫자 타입
  let ddd: number = 10;

  //boolean 타입
  let eee: boolean = true;
  eee = false;
  eee = 'false'; // true : 빈 값이 아니어서 true로 작동함 -> 이런 부분을 유의해야합니다.

  //베열 타입
    let fff: number[] = [1, 2, 3, 4, 5, "안녕하세요"]
    let ggg: string[] = ["철수", "영희", "훈이", 10]
    let hhh: (string | number)[] = ["철수", "영희", "훈이", 10] 
  // 만약 어떤 타입인지 모르겠을 때에는 일단 데이터를 넣어보고 어떤 타입인지 추론해서 역으로 알아내는 방법이 있습니다.
  

  //객체타입

  interface IProfile {
        name: string
        age: number | string
        school: string
        hobby?: string //? : '있으면'이라는 뜻으로, 사용해도 되고 사용하지 않아도 됩니다.
    }
    const profile: IProfile = {
        name: "짱구",
        age: 8,
        school: "떡잎마을유치원"
    }
    profile.name = "훈이" // 타입추론으로 이것만 가능합니다.
    profile.age = "8살"
    profile.hobby = "수영"

  //함수 타입 : 어디서 몇번이든 호출이 가능하기 때문에 반드시 타입 명시를 해줘야합니다.

    // : 뒤에는 반환되었을 때 타입을 명시합니다.
  function add(num1: number, num2: number, unit: string): string {
    return num1 + num2 + unit;
  }
  const result = add(10, 20, 'km'); // '30km', const result: string 이렇게 알아서 결과의 리턴 타입을 추론합니다.
  add(true, false, '원'); //이렇게 함수는 여러번 호출할 수 있기에 타입 추론이 불가합니다.

  //화살표 함수 타입
  const add2 = (num1: number, num2: number, unit: string): string => {
    return num1 + num2 + unit;
  };
  const result2 = add2(10, 20, 'km');

  //any 타입 : 무엇이든 가능하다, 즉 이건 js랑 별반 다를게 없어서 가급적 지양해야하는 타입니다.
  let zzz: any = 10;
  zzz = 'hello';
  zzz = true;

  // 이 밑에는 내가 알아서 예시찾아보고 공부

  //void 타입 : 함수가 아무런 값을 반환하지 않을 때 사용됩니다.
  //예를 들어, return 하지 않고 함수가 끝날때 주로 사용됩니다.
  function ggg(): void {
    console.log('hello');
  }

  //never 타입 : 절대 정상적으로 끝나지 않을 때 사용됩니다. 
  // 예를 들어, 오류를 던지거나 무한 루프에 빠져서 종료되지 않는 함수에서 사용됩니다.
  function hhh(): never {
    throw new Error('error');
  }

  //null & undefined 타입 :  null은 값이 없는 상태, undefined는 변수가 선언되었으나 초기화되지 않은 상태를 나타냅니다. 
  // 이 둘은 보통 특정 변수가 값이 없는 상태일 때 사용됩니다.
  let jjj: null | undefined = null;
  jjj = undefined;
  jjj = 'hello'; //error

 
};
profile
중요한 건 꺾여도 다시 일어서는 마음

0개의 댓글