| name | typescript-type-design |
| description | null |
Type Design
Category: typescript · Status: 🟢 Active
When to use
Khi thiết kế kiểu cho domain model, props, hoặc dữ liệu có nhiều trạng thái.
Steps
- Dùng
interface cho object/contract có thể mở rộng; type cho union/intersection/alias.
- Mô hình hóa trạng thái loại trừ nhau bằng discriminated union (field
kind/status).
- Ưu tiên union literal thay vì
string rộng cho tập giá trị cố định.
- Làm field bất biến với
readonly; tránh optional thừa gây "có thể undefined" lan tỏa.
- "Make illegal states unrepresentable": thiết kế type sao cho không tạo được state sai.
Template
type RequestState<T> =
| { status: "idle" }
| { status: "loading" }
| { status: "success"; data: T }
| { status: "error"; error: string };
function render(s: RequestState<User>) {
if (s.status === "success") return s.data.name;
}
Example
Good: Discriminated union theo status, data chỉ tồn tại khi success.
Avoid: { loading: boolean; data?: T; error?: string } cho phép tổ hợp state vô lý.
Checklist