C.W.K.
Stream
Lesson 01 of 05 · published

Big Three Primitive: string, number, boolean

~10 min · primitives, string, number, boolean

Level 0Curious
0 XP0/93 lessons0/23 achievements
0/100 XP to next level100 XP to go0% complete
"모든 프로그램은 3개 primitive 와 몇 개 special case 의 그래프야. 그 3개부터 시작해."

Big three 의 모양

모든 TypeScript 프로그램은, 바닥에선 string, number, boolean 값의 그래프야. 만나게 될 다른 대부분 타입은 이것들의 container, shape, union 이야.

Annotation 은 소문자로 써: string, number, boolean. 절대 String, Number, Boolean 이 아냐 — 그건 JavaScript wrapper-object constructor 고, 타입으로 쓰고 싶을 일 거의 없어. 소문자 형태가 실제로 원하는 primitive 타입이야.

string — Default 가 UTF-16

`string` 타입은 모든 JavaScript string 커버: single quote ('hi'), double quote ("hi"), template literal (`hi ${name}`). 셋 다 `string` 타입 값 만들어. 3개 문법 형태는 취향이랑 templating 용, 타입 구별 용이 아냐.

JavaScript string 은 내부적으로 UTF-16. 그 디테일은 non-BMP 문자 (대부분 emoji, 일부 CJK 한자) 다룰 때까지 거의 안 중요해 — 거기선 '😀'.length === 2 보게 돼, emoji 가 surrogate pair 라서. 이게 중요할 땐 code unit 대신 code point 로 iterate 하기 위해 [...str] 이나 Array.from(str) 써.

number — IEEE 754 double, integer 타입 없음

TypeScript 의 `number` 는 JavaScript 의 `number`: 64-bit IEEE 754 double-precision float. 별개 integer 타입 없음. 1, 1.5, NaN, Infinity, -0 다 `number` 타입. Safe integer 의 전체 범위는 ±2^53 − 1 (Number.MAX_SAFE_INTEGER 로 표현). 그 이상은 integer 산술이 정밀도 잃어 — 그래서 `bigint` 있음, 나중 lesson 에서 다뤄.

`int` 타입 alias 도입해서 runtime 이 강제할 거라고 가장하지 마. Type system 이 구별 안 함; runtime 도 안 함. 보장과 함께 integer 산술 필요하면 `bigint` 쓰거나 너만의 경계 지켜.

boolean — `true` 와 `false` 뿐

`boolean` 은 두 값. 놀랄 거 없어. 봐야 할 것은 runtime 의 JavaScript coercion 규칙 (if ('') /* falsy */, if (0) /* falsy */, if ('false') /* truthy! */) — boolean 이 string/number 표현식에서 계산될 때 여전히 적용. TypeScript 가 strict mode 에서 boolean 을 호환 안 되는 거랑 비교하면 경고하지만, 모든 coercion 실수 못 잡아.

소문자 primitive, wrapper 클래스 아님: : string 이 primitive 타입. : String 은 wrapper-object 타입 — 다르고, 거의 원하지 않는 거, lint 규칙이 flag 함. 모든 TypeScript 스타일 가이드와 공식 Handbook 이 소문자 형태 써.

피파의 고백

cwkPippa frontend 의 모든 primitive 가 이 셋 중 하나야. 시간은 `Date.now()` 에서 와 (number, epoch 이후 밀리초). 이름은 string. Flag 는 boolean. 화려한 타입들 — `BrainName`, `ConversationId`, `SoulId` — 다 이 셋 위에 literal 타입이나 generic 으로 좁혀서 만들어. Primitive 가 1층; 위는 다 장식.

Code

소문자 primitive, 대문자 wrapper 아님·typescript
// 3개 primitive, 모든 모양.

const name: string = 'Pippa';
const alt: string = `Hi, ${name}`;          // template literal — 여전히 string
const escaped: string = "don't quote me";   // single, double, template — 다 string

const age: number = 21;
const pi: number = 3.14159;
const broken: number = NaN;                  // 여전히 number
const max: number = Number.MAX_SAFE_INTEGER; // 2^53 - 1

const online: boolean = true;
const inverse: boolean = !online;            // false

// 흔한 실수 — wrapper-object 타입:
const wrong: String = 'Pippa';               // ⚠️ 컴파일 됨, 근데 lint 가 flag
// 항상 소문자 primitive 형태 써: string, number, boolean.
모든 TS dev 가 일찍 한 번 맞을 만한 number gotcha 2개·typescript
// 일찍 알아둘 number gotcha 2개.

// 1. Integer 타입 없음 — 다 double.
const tiny = 0.1 + 0.2;                      // 0.30000000000000004 — IEEE 754 현실

if (tiny === 0.3) {
  // ❌ 도달 안 됨
} else {
  console.log('Float 가 거짓말함. 비교엔 Number.EPSILON 써.');
}

// 2. NaN 은 NaN 과 같지 않아.
const notANumber = NaN;
if (notANumber === NaN) {
  // ❌ 도달 안 됨 — spec 상 NaN !== NaN
}
if (Number.isNaN(notANumber)) {
  // ✅ 실제로 체크하는 법
}

External links

Exercise

'$12.34' 같은 string 반환하는 formatPrice(amount: number, currency: string): string 함수 써. 이제 return type 위 hover 해서 inference 확인. 그다음 formatPrice('12', 'USD') 로 호출 시도 — compiler 가 뭐라고 해? 왜 그 에러 메시지가 TypeScript 한테 우리가 원했던 거 정확히 그거야?
Hint
Compiler 가 argument 1 이 string 아니라 number 여야 한다고 말할 거. 한 에러 메시지에 TypeScript 의 전체 pitch — runtime 버그가 compile 시점에 잡힘. 잠깐 감상해.

Progress

Progress is local-only — sign in to sync across devices.
이 페이지에서 버그를 발견하셨거나 피드백이 있으세요?문제 신고
💛 by 똘이warm

댓글 0

🔔 답글 알림 (로그인 필요)
로그인댓글을 남기려면 로그인해 주세요.

아직 댓글이 없어요. 첫 댓글을 남겨보세요.