Typescript

쉽게 시작하는 타입스크립트 (https://joshua1988.github.io/ts/intro.html)

• any라는 타입은 타입 검사를 하지 않음(어떤 타입이 사용되는지 추적 불가), 사용 지양

Interface

• 옵션속성

  interface 인터페이스_이름 {
    속성?: 타입;
  }

Union Type, Enum, Intersection Type
Union Type

• 변수의 값이 여러 타입을 가지는 경우 주로 사용
• 주로 문자열 리터럴에서 사용
• 컴파일 타임에만 존재
• 모든 타입의 열거형

type Color = "Red" | "Black" | "White";
console.log(Color); // error

열거형(enum)

• 특정 값들의 집합을 의미하는 자료형
• 컴파일 타임, 런타임에 존재
• 문자열 또는 숫자의 열거형

enum Color {
  Red,
  Green,
  Blue,
}

console.log(Color); // no error

Intersection Type

interface Person {
  name: string;
  age: number;
}
interface Developer {
  name: string;
  skill: number;
}
type Capt = Person & Developer; // { name: string; age: number; skill: string; }

제네릭(Generics)

function logText<T>(text: T): T {
  return text;
}

• 제네릭이란 타입을 마치 함수의 파라미터처럼 사용하는 것
• 제네릭이란 데이터의 타입을 일반화(generalize)한다.
• https://velog.io/@edie_ko/TypeScript-Generic-%EC%A0%9C%EB%84%A4%EB%A6%AD-feat.-TypeScript-%EB%91%90-%EB%8B%AC%EC%B0%A8-%ED%9B%84%EA%B8%B0

타입추론

• 타입 스크립트가 코드를 해석해 나가는 동작

타입호환

• 타입스크립트 코드에서 특정 타입이 다른 타입에 잘 맞는지를 의미

타입별칭

• 특정 타입이나 인터페이스를 참조할 수 있는 타입 변수
• 확장이 불가해 가능하면 type보다는 interface로 선언하여 사용하는 것 권장

타입단언

• 개발자가 해당 타입에 대해 확신이 있을 때 사용하는 타입 지정 방식
• 타입스크립트 컴파일러보다 개발자가 더 해당 타입을 잘 알고 있을 때나 자바스크립트 기반 코드에 점진적으로 타입스크립트를 적용할 때 사용
• as 키워드 사용

Usage
https://joshua1988.github.io/ts/usage/modules.html => ING

---

https://www.typescriptlang.org/docs/handbook/intro.html

tsconfig

tsconfig 파일 분리

• Vue.js 프로젝트의 경우 애플리케이션 코드와 노드 서버 코드가 분리되어 있어서, 이 두가지 환경에서 서로 다른 TypeScript 설정이 필요할 수 있음
• 빌드 시간 최적화

compilerOptions.moduleResolution
TypeScript 컴파일러가 모듈을 해석하는 방법을 설정하는 옵션입니다.
이 옵션은 주로 모듈을 찾는 방식과 관련하여 사용됩니다.