본문 바로가기
[ TypeScript ]

1. TypeScript 기초 : 타입(Type)

by SmileRush 2023. 2. 1.
반응형

타입스크립트를 공부하기 위한 목차

  1. TypeScript 기초: 타입, 변수, 함수, 클래스, 인터페이스 등
  2. TypeScript 특징: 제네릭, 모듈, 네임스페이스, 열거형 등
  3. TypeScript 고급: 믹스인, 추상 클래스, 데코레이터, 고급 타입 등
  4. TypeScript 활용: 프로젝트 구조 설계, 적용하기, 실제 애플리케이션 개발 등

1.1 타입

TypeScript에서 타입은 변수에 할당할 수 있는 값의 종류를 의미한다.
보통 사용되는 타입들은 다음과 같다.

  • number, string, boolean 등의 Primitive 타입
  • 객체 타입
  • 배열 타입
  • 튜플 타입
  • 열거형 타입
  • any 타입
  • void 타입 등이 있습니다.

여기서 커스텀한 타입을 만들어서 사용할 수도 있다.
(아래 예시의 Villein 인터페이스, Superhero 타입이 그 예시이다)

  1. Primitive 타입은 어려운 말로 "원시 타입"이라고 부른다.
    숫자(number), 문자열(string), 불리언(boolean) 등의 값을 표현한다.
  2. 객체 타입은 객체를 표현한다.
    객체 타입은 프로퍼티와 메서드를 가질 수 있습니다.
  3. 배열 타입은 배열을 나타낸다.
    배열에는 여러가지 타입의 구성원이 포함될 수 있다.
    배열 타입은 배열의 길이와 원소의 타입이 변할 수 있으며, 각 원소에 접근하기 위해 인덱스(index)를 사용할 수 있다.
    (인덱스에 관하여는 추후 배열편에서)

타입의 사용 예시

interface Villein {
	name: string
	powers: string[]
}

const Joker: Villein = {
	name: "Joker"
	powers: ["Unknown"]
}

type Superhero = {
	name: string
	secretIdentity: string
	powers: string[]
};

let batman: Superhero = {
	name: "Batman"
	secretIdentity: "Bruce Wayne"
	powers: ["Fighting skills", "Intelligence", "Wealth"]
};

let superman: Superhero = {
	name: "Superman"
	secretIdentity: "Clark Kent"
	powers: ["Super strength", "Super speed", "Super breath"]
};

위는 type과 interface라는 키워드로 타입을 생성한 것이다.
타입을 생성하는 방법은 type, interface 둘이 존재한다.
각자 장단점이 존재하지만, 심지어 혼용해서 사용해도 큰 문제가 발생하지 않는다.

TypeScript는 개발자의 오로지 편의를 위해 존재할 뿐,
Code 실행되는 Runtime때는 TypeScript는 아무것도 하지않고, 오로지 JavaScript만이 동작한다.

반응형

댓글