Typescript handbook 읽고 정리

Everyday Types

배열

• Array<number> vs number[]
• 두개의 차이점을 이야기하자만, 전자는 generic syntax고, 후자는 shortand구문으로 제너릭이 필요한 경우 전자를 사용하면 된다.

any

• 타입스크립트의 틀별한 타입으로, 타입 검사오류의 발생이 되지 않는다.
• any를 사용하는 경우 추가적인 타입검사 자체가 비활성화되며 보통 굳이 긴타입으로 정의하는 것이 비효율적일 때 사용한다.

noImplicitAny 설정을 켜놓는 경우는 any를 사용하는 경우 오류를 발생시킵니다. (설정하기 나름이다…)

변수에 대한 타입 표기

아래와 같다 간단..

const name : string = “Mercury”

함수

함수의 주요목적이 입출력인 것처럼 타입스크립트도 입출력의 타입을 지정할 수 있다.

• 매개변수 뒤에 표기
• 리턴값 매개변수의 타입 뒤에 표기
  • 반환값은 표기하지 않아도 되는게 일반적? 왜..? → return 문을 바탕으로 반환타입이 자동 추론되기 때문,

function getFavoriteNumber(): number {
  return 26;
}

익명함수에서는 어떻게 적용?

함수 호출시 함수가 어떻게 호출될지 알 수 있다면, 매개변수에 자동으로 타입을 부여한다.(이러한 것은 문맥적 타입부여라고 한다.)

객체타입 ({ })

• 타입을 지정하지 않으면 any로 간주
• 쉬워서 예시로 대체

// 매개 변수의 타입은 객체로 표기되고 있습니다.
function printCoord(pt: { x: number; y: number }) {
  console.log("The coordinate's x value is " + pt.x);
  console.log("The coordinate's y value is " + pt.y);
}
printCoord({ x: 3, y: 7 });

• 선택적인 타입으로 옵셔널로 지정할 수도있는데 프로퍼티 뒤에 ?을 붙여주면 된다.

유니언 타입 ( | )

타입스크립트는 기존 타입을 기반으로 다양한 연사자를 통해 또 다른 새로운 타입을 만들어 낼 수 있다.

• 사용방법

function printId(id: number | string) {
  if (typeof id === "string") {
    // 이 분기에서 id는 'string' 타입을 가집니다
 
    console.log(id.toUpperCase());
  } else {
    // 여기에서 id는 'number' 타입을 가집니다
    console.log(id);
  }
}

⇒ 두개의 유니언 타입이 동일 메서드를 내장하고 있다면 문맥을 통해 상황을 좁히지 않아도 사용할 수 있다.

타입 별칭

타입이 자주 활용되어 재사용하고 싶거나 이름을 붙이고 싶은 경우 사용한다.

type ID = number | string;

인터페이스

인터페이스를 통한 선언은 객체타입을 만드는 또 다른 방법이다.

interface Point {
  x: number;
  y: number;
}

참고자료 - https://medium.com/humanscape-tech/type-vs-interface-언제-어떻게-f36499b0de50 interface vs type Interface 는 선언 병합이 가능 하지만, Type Alias는 불가능하다.

TypeScript 팀은 개방-폐쇄 원칙에 따라 확장에 열려있는 JavaScript 객체의 동작 방식과 비슷하게 연결하도록 Interface를 설계했습니다.

그래서 TypeScript 팀은 가능한 Type Alias보단 Interface를 사용하고, 합 타입 혹은 튜플 타입을 반드시 써야 되는 상황이면 Type Alias를 사용하도록 권장하고 있습니다.

타입단언 (as)

사용자가 더 타입에 대한 정보를 잘 아니까 너에게 권한을 줄게!의 의미에서 생긴 타입스크립트의 키워드이다.

타입 assertion은 컴파일러에 의해서 제거된다. 따라서 검사는 런타임중에 이루어지지 않는다. 따라서 틀리더라도 예외가 발생하지 않는다.

리터럴 타입

리터럴이란? 리터럴은 변수의 값이 변하지 않는데이터(메모리 위치안의 값)를 의미한다.

타입스크립트에서는 구체적인 문자열과 숫자 값을 지정할 수 있다.

let x: "hello" = "hello";

위와 같은 예시를 보면 딱히? 왜 쓸까? 하는 생각이 든다…

하지만 유니언과 함께 사용한다면?

const direction : "left" | "rigth" |"up" |"down" = "up"

딱 봐도 쓸 곳이 많아보이죠? 필요없는 것은 만들지도 않았을 겁니다.ㅋㅋ

타입스크립트 너는 다 계획이 있구나

리터럴도 추론이 될까요 그럼?