유틸리티 타입 소개

한 입 크기로 잘라먹는 타입스크립트 - 유틸리티 타입 (Utility Types)


1. 유틸리티 타입
타입스크립트가 자체적으로 제공하는 특수한 타입들.
제네릭, 맵드 타입, 조건부 타입 등의 타입 조작 기능을 이용해 실무에서 자주 사용되는 타입을 미리 만들어 놓은 것.

예시)
Readonly<T> : 타입 변수로 전달한 객체 타입의 모든 프로퍼티를 readonly 프로퍼티로 바꿔준다.
Partial<T> : 타입 변수로 전달한 객체 타입의 모든 프로퍼티를 선택적 프로퍼티로 바꿔준다.

타입스크립트가 제공하는 다양한 유틸리티 타입 : https://www.typescriptlang.org/docs/handbook/utility-types.html

Documentation - Utility Types

 

가장 자주 활용되는 유틸리티 타입 목록)
- 맵드 타입 기반
Partial
Required
Readonly
Pick<t, k></t, k>
Omit<t, k></t, k>
Record<k, v></k, v>

- 조건부 타입 기반
Exclude<t, u></t, u>
Extract<t, u></t, u>
ReturnType

강의 중에 직접 유틸리티 타입들을 만들기도 할 예정이다.
실제로 만나게될 문제가 타입스크립트가 제공하는 기본적인 기능들로 해결할 수 없을 때, 직접 여러가지 다양한 타입들을 제작하여 능동적으로 대응할 수 있도록 하기 위함이다.


* 실습 환경설정
section10 폴더를 생성한 뒤, section9 폴더에서 사용했던 package-lock.json, package.json, tsconfig.json 파일을 복사하여 section10 폴더에 붙여넣는다.
이후 package.json 파일에서 'name' 부분 값을 'section10' 으로 수정한다.

- package.json

{
  "name": "section10",
  ...
}

이후 터미널에서 'npm i' 명령어를 입력하여 package.json 의 'dependencies' 에 명시된 외부 패키지들을 일괄적으로 설치한다.

- Terminal

npm i

    added 2 packages, and audited 3 packages in 728ms

    found 0 vulnerabilities

이렇게 새로운 타입스크립트 프로젝트 세팅이 완료되었다.
이후 src 폴더를 생성하여 index.ts 파일을 만들어 제대로 동작하는지 테스트한다.
tsc 명령어를 이용하여 컴파일 후 컴파일된 자바스크립트 파일을 확인한다.

- index.ts

console.log('Hello');

- Terminal

tsc

- dist/index.js

console.log('Hello');
export {};

컴파일 결과를 node 로 실행하고 tsx 로 실행한다.

- Terminal

node dist/index.js
    Hello

tsx src/index.ts
    Hello

타입스크립트 패키지 초기설정을 완료했다.
실습 환경설정을 완료하였다.


참고링크 : https://www.inflearn.com/course/%ED%95%9C%EC%9E%85-%ED%81%AC%EA%B8%B0-%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8#

한 입 크기로 잘라먹는 타입스크립트(TypeScript) 강의 | 이정환 Winterlood - 인프런