docs(10_Wiki): 위키 전체 재구성 — Topic_* 폴더를 4개 카테고리로 통합 + 대규모 중복 제거
Topic_Agent/Topic_Blog/Topics/Topics_Biz/Topics_Meeting/Topics_Rag의 마크다운 지식 문서를 Topic_General/Topic_Programming/Topic_Graphic/Topic_Business 4개 카테고리로 재분류. - 중복 제거: frontmatter의 status:duplicate/merged + duplicate_of/redirect_to 필드로 자기 자신을 중복으로 선언한 리다이렉트 stub 1032개 제거, 완전 동일 내용 파일 472개 제거, 동일 파일명·다른 내용 충돌 시 더 큰(완전한) 버전만 유지(162개 제거) — 총 1639개 중복 제거. - 분류: 폴더 단위로 명확한 항목(AI_and_ML/Coding/Architecture 등 → Programming, Comfyui/Visual_Effects → Graphic, Topics_Biz/Topics_Meeting/사업 등 → Business, Poetic_Blog_Writing/창의성/Game_Design 등 → General)은 폴더 우선순위로, 나머지 혼재 폴더(Topic_Agent/Topic_Blog/Topics 루트/Thinking & Reasoning/Other/UI_UX_Assets)는 title/tags 키워드 스코어링으로 파일 단위 분류(불명확한 경우 General로 폴백). 원본 폴더명은 "From_*" 서브폴더로 보존해 추적 가능성 유지. - 최종 배치: Programming 2784 / General 1608 / Graphic 285 / Business 249 = 4926개 문서. - 에이전트 운영 상태(.astra/.agent/.obsidian/sessions/memory/_company/docs/lessons/_shared/src)는 지식 콘텐츠가 아니므로 재분류 대상에서 제외하고 원위치 유지. - Topics/Topic_email(상위 보호 폴더 Topic_email과 파일명 100% 중복) 삭제 — 보호 폴더 자체는 미변경. - 완전히 비게 된 Topic_Agent/Topic_Blog/Topics_Biz/Topics_Rag 폴더 제거.
This commit is contained in:
@@ -0,0 +1,214 @@
|
||||
---
|
||||
id: wiki-2026-0508-as-const
|
||||
title: as const
|
||||
category: 10_Wiki/Topics
|
||||
status: verified
|
||||
canonical_id: self
|
||||
aliases: [as const, const assertion, TypeScript const assertion]
|
||||
duplicate_of: none
|
||||
source_trust_level: A
|
||||
confidence_score: 0.9
|
||||
verification_status: applied
|
||||
tags: [typescript, types, const-assertion, literal-types]
|
||||
raw_sources: []
|
||||
last_reinforced: 2026-05-10
|
||||
github_commit: pending
|
||||
tech_stack:
|
||||
language: typescript
|
||||
framework: typescript-5
|
||||
---
|
||||
|
||||
# as const
|
||||
|
||||
## 매 한 줄
|
||||
> **"매 TypeScript 의 const assertion — literal type 으로 widening 차단"**. 매 TS 3.4 (2019) 도입. 매 array → readonly tuple, object → readonly with literal types. 매 enum 대안, discriminated union 의 핵심, type-safe routing/config 의 enabler.
|
||||
|
||||
## 매 핵심
|
||||
|
||||
### 매 widening behavior
|
||||
- 매 default: `const x = "hello"` → 매 type `string` (literal type widened).
|
||||
- 매 wait, `const` 변수는 literal 유지: `const x = "hello"` → `"hello"`. 매 그러나 object property 는 widened: `{ name: "alice" }` → `{ name: string }`.
|
||||
- `as const` 의 효과: 매 모든 nested literal 유지 + readonly + tuple inference.
|
||||
|
||||
### 매 변환 규칙
|
||||
- **String/number/boolean literal**: 매 widened type 매 → literal type.
|
||||
- **Array `[1, 2, 3]`**: 매 `number[]` → `readonly [1, 2, 3]` (tuple).
|
||||
- **Object `{ a: 1 }`**: 매 `{ a: number }` → `{ readonly a: 1 }`.
|
||||
- **Nested**: 매 deep recursive 적용.
|
||||
|
||||
### 매 응용
|
||||
1. **Discriminated unions**: 매 `kind: "circle" as const` 로 narrow.
|
||||
2. **Action creators (Redux)**: 매 type 이 literal string 으로 inferred.
|
||||
3. **Route configs**: 매 path 가 literal string 으로 inferred → type-safe `Link to=`.
|
||||
4. **Tuple returns**: 매 `return [value, setter] as const` — React custom hook pattern.
|
||||
5. **enum 대안**: 매 `const Status = { Idle: "idle", Loading: "loading" } as const`.
|
||||
|
||||
## 💻 패턴
|
||||
|
||||
### Tuple return — custom hook
|
||||
```ts
|
||||
function useToggle(initial = false) {
|
||||
const [on, setOn] = useState(initial);
|
||||
const toggle = useCallback(() => setOn(o => !o), []);
|
||||
return [on, toggle] as const;
|
||||
// 매 type: readonly [boolean, () => void]
|
||||
// 매 without `as const`: (boolean | (() => void))[] — useless union
|
||||
}
|
||||
|
||||
const [isOpen, toggle] = useToggle(); // 매 properly typed
|
||||
```
|
||||
|
||||
### Discriminated union via const
|
||||
```ts
|
||||
const success = (data: string) => ({ kind: "success", data } as const);
|
||||
const error = (msg: string) => ({ kind: "error", msg } as const);
|
||||
|
||||
type Result = ReturnType<typeof success> | ReturnType<typeof error>;
|
||||
// { readonly kind: "success"; readonly data: string }
|
||||
// | { readonly kind: "error"; readonly msg: string }
|
||||
|
||||
function handle(r: Result) {
|
||||
if (r.kind === "success") {
|
||||
r.data; // string
|
||||
} else {
|
||||
r.msg; // string
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Enum 대안 (lighter, tree-shakeable)
|
||||
```ts
|
||||
const Status = {
|
||||
Idle: "idle",
|
||||
Loading: "loading",
|
||||
Success: "success",
|
||||
Error: "error",
|
||||
} as const;
|
||||
|
||||
type Status = typeof Status[keyof typeof Status];
|
||||
// 매 "idle" | "loading" | "success" | "error"
|
||||
|
||||
function setStatus(s: Status) { /* ... */ }
|
||||
setStatus(Status.Loading); // ok
|
||||
setStatus("loading"); // ok — literal type
|
||||
setStatus("invalid"); // 매 type error
|
||||
```
|
||||
|
||||
### Type-safe config / route table
|
||||
```ts
|
||||
const routes = {
|
||||
home: "/",
|
||||
user: "/user/:id",
|
||||
settings: "/settings",
|
||||
} as const;
|
||||
|
||||
type RouteKey = keyof typeof routes;
|
||||
type RoutePath = typeof routes[RouteKey];
|
||||
// 매 "/" | "/user/:id" | "/settings"
|
||||
|
||||
function Link<K extends RouteKey>({ to }: { to: K }) {
|
||||
return <a href={routes[to]}>...</a>;
|
||||
}
|
||||
```
|
||||
|
||||
### Array of literals → union
|
||||
```ts
|
||||
const SIZES = ["sm", "md", "lg", "xl"] as const;
|
||||
type Size = typeof SIZES[number];
|
||||
// 매 "sm" | "md" | "lg" | "xl"
|
||||
|
||||
function Button({ size }: { size: Size }) { /* */ }
|
||||
|
||||
// 매 runtime + type 동시 derive — 매 single source of truth.
|
||||
SIZES.forEach(s => console.log(s)); // runtime iterable
|
||||
```
|
||||
|
||||
### Action creators (Redux Toolkit 이전 패턴)
|
||||
```ts
|
||||
const incrementAction = (n: number) => ({
|
||||
type: "counter/increment",
|
||||
payload: n,
|
||||
} as const);
|
||||
|
||||
type IncrementAction = ReturnType<typeof incrementAction>;
|
||||
// { readonly type: "counter/increment"; readonly payload: number }
|
||||
```
|
||||
|
||||
### Deep readonly via as const
|
||||
```ts
|
||||
const config = {
|
||||
api: {
|
||||
baseUrl: "https://api.example.com",
|
||||
timeout: 5000,
|
||||
},
|
||||
features: ["auth", "billing"],
|
||||
} as const;
|
||||
|
||||
config.api.baseUrl = "..."; // 매 error: readonly
|
||||
config.features.push("new"); // 매 error: readonly
|
||||
config.api.baseUrl; // type: "https://api.example.com" (literal)
|
||||
```
|
||||
|
||||
### satisfies + as const (TS 4.9+)
|
||||
```ts
|
||||
const palette = {
|
||||
red: "#ff0000",
|
||||
blue: "#0000ff",
|
||||
green: "#00ff00",
|
||||
} as const satisfies Record<string, `#${string}`>;
|
||||
|
||||
palette.red; // type: "#ff0000" — literal preserved
|
||||
// 매 satisfies validates shape, as const preserves literals.
|
||||
```
|
||||
|
||||
## 매 결정 기준
|
||||
| 상황 | Approach |
|
||||
|---|---|
|
||||
| Custom hook tuple return | `as const` 필수. |
|
||||
| Enum 대체 | `as const` object + `typeof[keyof]`. |
|
||||
| Config / route table | `as const` + `satisfies` (TS 4.9+). |
|
||||
| Discriminated union | `kind: "x" as const` literal narrow. |
|
||||
| Mutable runtime data | 매 `as const` 사용 X — readonly 가 방해. |
|
||||
|
||||
**기본값**: 매 const literal 유지 필요 시 `as const`. 매 type validation 까지 매 `as const satisfies`.
|
||||
|
||||
## 🔗 Graph
|
||||
- 부모: [[TypeScript]] · [[TypeScript 타입 시스템 (TypeScript Type System)|Type System]]
|
||||
- 변형: [[Satisfies Operator]] · [[Readonly]]
|
||||
- 응용: [[Discriminated_Unions|Discriminated Unions]] · [[Custom Hooks]] · [[Redux Toolkit]]
|
||||
- Adjacent: [[Literal Types]] · [[Branded Types for Nominal Typing]]
|
||||
|
||||
## 🤖 LLM 활용
|
||||
**언제**: custom hook tuple return, enum 대체, action creator, route/config table 의 type-safety, discriminated union narrowing 의.
|
||||
**언제 X**: 매 mutable 한 runtime data (readonly 가 방해), 매 simple primitive 의 (`const x = 1` 매 already literal).
|
||||
|
||||
## ❌ 안티패턴
|
||||
- **`as` cast 와 혼동**: 매 `as const` 매 special — `as Foo` (type assertion) 와 다름.
|
||||
- **Mutable assumption**: 매 `as const` array 매 readonly — `.push()` X. `[...arr]` spread 후 mutate.
|
||||
- **Object 의 partial as const**: 매 nested object 의 일부만 const 의도 — 매 not possible. 매 전체 deep 매 readonly.
|
||||
- **enum + as const 동시**: 매 redundant. enum 자체로 literal type.
|
||||
- **JSON.stringify 의 사용**: 매 JSON 화하면 readonly 손실 — runtime 에서 의미 없음.
|
||||
|
||||
## 🧪 검증 / 중복
|
||||
- Verified (TypeScript Handbook, TS 3.4 release notes).
|
||||
- 신뢰도 A.
|
||||
|
||||
## 🕓 Changelog
|
||||
| 날짜 | 변경 |
|
||||
|---|---|
|
||||
| 2026-05-08 | Phase 1 |
|
||||
| 2026-05-10 | Manual cleanup — const assertion patterns, enum 대안, discriminated union, satisfies combo 추가 |
|
||||
|
||||
## 🛠️ 적용 사례 (Applied in summary)
|
||||
|
||||
<!-- CODE-GROUNDING:START -->
|
||||
### 🔎 코드베이스 근거 (자동 추출 — E:\Wiki 레포)
|
||||
**실제 구현/사용 위치:**
|
||||
- `photoai/src/shared/constants.ts:4` — export const SUPPORTED_EXTENSIONS = ['.jpg', '.jpeg', '.png', '.webp'] as const
|
||||
- `photoai/src/preload/inference.ts:13` — ] as const
|
||||
- `photoai/src/main/menu.ts:107` — type: 'radio' as const,
|
||||
- `connectai/src/features/hire/hireStore.ts:26` — export const KNOWN_STAGES = ['inbox', 'screened', 'interview', 'final', 'offer', 'accepted', 'hired', 'rejected', 'decli
|
||||
- `connectai/src/features/datacollect/handlers.ts:117` — for (const part of [1, 2, 3] as const) {
|
||||
|
||||
_자동 생성: code_grounding.mjs · 재실행 시 갱신됨_
|
||||
<!-- CODE-GROUNDING:END -->
|
||||
Reference in New Issue
Block a user