---
id: wiki-20260508-type-casting-redir
title: Type Casting
category: 10_Wiki/Topics
status: verified
canonical_id: self
aliases: [type assertion, type coercion, as cast]
duplicate_of: none
source_trust_level: A
confidence_score: 0.92
verification_status: applied
tags: [typescript, type-system, fundamentals]
raw_sources: []
last_reinforced: 2026-05-10
github_commit: pending
tech_stack:
  language: TypeScript
  framework: tsc
---

# Type Casting

## 매 한 줄
> **"매 compiler 에 'trust me' 의 signal — runtime 의 영향 X 의 compile-time 만 의 type 변경"**. TS 의 `as` operator / angle-bracket — 매 runtime conversion 의 X (cf. JS coercion). 매 2026 의 best practice 의 minimize + zod / type guard 의 prefer.

## 매 핵심

### 매 종류
- **Type assertion** (TS): `value as Type` — 매 compile-time only.
- **Type coercion** (JS): `Number(x)`, `+x`, `String(x)` — 매 runtime 변환.
- **Type guard**: `typeof / instanceof / in / custom predicate` — 매 narrowing.
- **Type predicate**: `function isFoo(x): x is Foo` — 매 user-defined narrowing.

### 매 동작 원리
- `as` 의 compile time 만 의 type swap — 매 generated JS 의 동일.
- 매 unsafe — 매 actual shape 의 mismatch 시 runtime error 의 latent.
- 매 double assertion `as unknown as T` — 매 incompatible type 의 강제.
- 매 runtime validation (zod / valibot) 의 결합 의 권장.

### 매 응용
1. External API response 의 typing — 매 zod 의 parse 후 타입 의 narrow.
2. JSON.parse 의 unknown 의 narrowing.
3. DOM query 의 Element → HTMLInputElement.

## 💻 패턴

### 매 Type assertion (basic)
```typescript
const el = document.querySelector('input') as HTMLInputElement;
el.value = 'hello';  // 매 HTMLElement 가 아닌 HTMLInputElement 의 value 접근
```

### 매 Double assertion (last resort)
```typescript
const raw = JSON.parse(text);  // 매 any
const data = raw as unknown as MyType;  // 매 강제 cast
// 매 BAD — 매 zod 의 prefer
```

### 매 Type guard (preferred)
```typescript
function isUser(x: unknown): x is User {
  return typeof x === 'object' && x !== null
      && 'id' in x && typeof (x as any).id === 'string';
}

const data: unknown = JSON.parse(text);
if (isUser(data)) {
  data.id;  // 매 narrowed
}
```

### 매 Zod 의 runtime validation 의 결합
```typescript
import { z } from 'zod';

const UserSchema = z.object({
  id: z.string(),
  email: z.string().email(),
});
type User = z.infer<typeof UserSchema>;

const parsed = UserSchema.parse(JSON.parse(text));
// 매 parsed 의 User type — 매 cast X, 매 actual validation
```

### 매 const assertion
```typescript
const config = { url: '/api', method: 'GET' } as const;
// 매 type: { readonly url: '/api'; readonly method: 'GET' }
// 매 literal type 의 보존
```

### 매 Non-null assertion
```typescript
const input = document.getElementById('email')!;  // 매 null 의 부정
// 매 dangerous — 매 optional chaining + guard 의 prefer
const safe = document.getElementById('email');
if (!safe) throw new Error('missing');
```

### 매 Satisfies operator (TS 4.9+)
```typescript
type Color = 'red' | 'green' | 'blue';
const palette = {
  primary: 'red',
  secondary: 'green',
} satisfies Record<string, Color>;
// 매 cast 와 달리 actual literal type 의 보존 + check 의 둘 다
palette.primary;  // type: 'red' (not Color)
```

### 매 JS coercion (different topic)
```javascript
const n = Number('42');     // 매 string → number 의 runtime 변환
const s = String(123);      // 매 number → string
const b = Boolean(0);       // 매 falsy → false
// 매 TS 의 cast 와 무관 — 매 actual conversion
```

## 매 결정 기준
| 상황 | Approach |
|---|---|
| External JSON | zod / valibot parse |
| DOM query | type assertion `as HTMLInputElement` |
| Custom narrowing | type predicate `x is T` |
| Literal preserve | satisfies / as const |
| any → known | type guard 의 prefer over cast |

**기본값**: 매 cast 의 minimize. 매 type guard / runtime validation 의 default.

## 🔗 Graph
- 부모: [[TypeScript]] · [[Type System]]
- 변형: [[Type Guard]] · [[Type Predicate]]
- 응용: [[Zod 파싱과 브랜디드 타입을 결합한 런타임 데이터 검증]] · [[DOM 요소 조작 및 타입 좁히기]]
- Adjacent: [[Discriminated Unions]] · [[Structural Typing]]

## 🤖 LLM 활용
**언제**: TS unsafe cast 의 detect, zod migration 의 권장, satisfies 의 도입.
**언제 X**: 매 cast 의 단순 추가 의 답변 — 매 root cause (validation 부재) 의 fix.

## ❌ 안티패턴
- **`as any`**: 매 type system 의 escape — 매 unknown + guard 의 사용.
- **Double cast**: `as unknown as T` 의 frequent 사용 — 매 design smell.
- **Non-null `!`의 남용**: 매 actual null 시 silent crash.

## 🧪 검증 / 중복
- Verified (TypeScript Handbook "Type Assertions").
- 신뢰도 A.

## 🕓 Changelog
| 날짜 | 변경 |
|---|---|
| 2026-05-08 | Phase 1 |
| 2026-05-10 | Manual cleanup — Type casting FULL 작성 |
