숏컷 코드

let title: string = "RefDock";
let count: number = 42;
let done: boolean = false;
let tags: string[] = ["ts", "types"];
let position: [number, number] = [10, 20];

기초 타입

입문 단계에서 먼저 봐 둘 타입 인벤토리는 아래 다섯 가지입니다.

• string
• number
• boolean
• T[]
• [A, B]
• 값이 비어 있을 수도 있으면 다음 카드의 union/null 축으로 이어짐

1) 원시 값은 소문자 타입으로 읽는다

문자열, 숫자, 불리언은 각각 string, number, boolean으로 적습니다.

const name: string = "Mina";
const age: number = 26;
const active: boolean = true;

이 기본 타입이 이후 union, generic, utility type의 재료가 됩니다.

2) 같은 타입 여러 개면 배열

같은 종류 값을 여러 개 담고 순회하는 구조라면 배열이 기본입니다.

const names: string[] = ["Ada", "Linus"];

즉 "원소의 역할이 전부 비슷한가?"를 먼저 보면 됩니다.

const tags: string[] = ["ts", "types"];
const point: [number, number] = [10, 20];

둘 다 여러 값을 담지만, 배열은 같은 종류 목록이고 튜플은 각 자리 의미가 고정된 구조라는 차이가 있습니다.

3) 각 자리 의미가 다르면 튜플

좌표처럼 첫 번째 값과 두 번째 값의 의미가 정해져 있다면 튜플이 더 맞습니다.

const point: [number, number] = [10, 20];

배열이 "같은 타입 목록"이라면, 튜플은 "자리 의미가 정해진 짧은 구조"에 가깝습니다.

4) wrapper 타입보다 원시 타입 표기가 기준이다

TypeScript에서는 String, Number, Boolean보다 string, number, boolean을 기본으로 씁니다. 대문자 래퍼 타입은 JavaScript 객체 모델과 섞여 불필요한 혼란을 만들 수 있습니다.

5) 기본 타입 선택이 뒤 카드의 난이도를 결정한다

union, narrowing, object type, generic 같은 뒤 카드도 결국 "기본 재료를 어떻게 조합하느냐"의 문제입니다. 그래서 입문 단계에서는 화려한 문법보다 값 종류 구분을 먼저 단단히 하는 편이 좋습니다.

• 하나의 값 범주를 먼저 정한다
• 여러 가능성이 생기면 union으로 넘어간다
• 구조가 생기면 object type이나 tuple로 넘어간다

const tags: string[] = ["ts", "types"];
const point: [number, number] = [10, 20];

tags.push("docs");      // 자연스러운 사용
point[0] = 30;          // 허용

배열과 튜플은 둘 다 인덱스로 접근하지만 질문이 다릅니다. 배열은 "원소가 더 늘어날 수 있는 목록"이고, 튜플은 "각 자리에 의미가 있는 고정 구조"입니다.

언제 어떤 타입으로 둘까

체크포인트

• 텍스트 값이다: string
• 숫자 계산이다: number
• 상태 플래그다: boolean
• 같은 타입 목록이다: T[]
• 자리 의미가 고정됐다: 튜플 [A, B]
• 기본 타입 표기다: 소문자 원시 타입

주의할 점

// ❌ 래퍼 타입 사용
let title: String = "RefDock";

// ✅ 원시 타입 사용
let title: string = "RefDock";

// ❌ 자리 의미가 중요한데 일반 배열로 둠
const point: number[] = [10, 20];

// ✅ 각 자리가 다른 의미를 가지면 튜플
const pointTuple: [number, number] = [10, 20];

// ❌ boolean 자리에 문자열 플래그를 두면 상태 계약이 흐려진다
let done: string = "yes";

// ✅ 참/거짓 상태는 boolean으로 먼저 고정한다
let doneOk: boolean = true;