Record와 Readonly: 사전과 읽기 전용 모양 만들기

"Record는 키 공간을, Readonly는 쓰기 권한을 타입으로 선언해."

Record로 키와 값의 관계를 적어

Record<K, V>는 K에 속한 키마다 V 타입의 값을 가진 객체를 만들어. Record<string, number>는 문자열 키의 숫자 사전이고, Record<'r' | 'g' | 'b', number>는 세 키를 모두 요구하는 닫힌 표야.

닫힌 키 공간에서는 완전성을 얻어

리터럴 유니언을 K로 주면 빠진 키와 여분 키를 모두 검사할 수 있어. 상태별 색상, 권한별 설정처럼 모든 경우에 값이 있어야 하는 표에 유용해. 유니언에 새 값을 추가하면 Record를 만드는 모든 자리에서 새 키가 필요하다는 오류가 나.

Readonly는 최상위 쓰기를 막아

Readonly<T>는 T의 모든 최상위 속성에 readonly를 붙여. 함수가 받은 설정을 바꾸지 못하게 하거나 완성된 스냅샷의 재대입을 막을 때 쓸 수 있어. 배열의 readonly와 마찬가지로 실행 중 객체를 얼리는 것은 아니고 중첩 객체까지 자동으로 깊게 적용되지도 않아.

키가 열려 있는 사전인지 닫힌 표인지 먼저 정해. Record의 K가 그 차이를 말하고, Readonly는 누가 바꿀 수 있는지를 말해.

Code

Record 와 Readonly — dictionary 와 불변성·typescript

// Record — dictionary.
type PhoneBook = Record<string, string>;       // 어떤 string key 든 → string
const pb: PhoneBook = { pippa: '555-0001', dad: '555-0002' };

// Literal union 가진 Record — 정확히 그 key 들.
type RGB = Record<'r' | 'g' | 'b', number>;
const color: RGB = { r: 255, g: 0, b: 128 };   // 셋 다 필수
// const bad: RGB = { r: 255 };                 // ❌ g, b 빠짐

// Readonly — 모든 필드 readonly.
type FrozenUser = Readonly<{ id: number; name: string }>;
const u: FrozenUser = { id: 1, name: 'Pippa' };
u.name = 'Other';        // ❌ Cannot assign to 'name' because it is a read-only property

// 흔한 조합 — frozen dictionary.
type FrozenMap<V> = Readonly<Record<string, V>>;

Exercise

primary | secondary | accent 키와 16진수 색상 값을 가진 팔레트를 Record로 만들어. Readonly를 적용한 뒤 네 번째 키와 기존 값 변경이 막히는지 확인해.

Hint

리터럴 키 합집합을 쓴 Record는 정해진 세 키를 모두 요구하고 그 밖의 키는 거절해. 이 닫힌 키 집합이 빠진 항목과 불필요한 항목을 함께 잡아 줘.

Record로 키와 값의 관계를 적어

닫힌 키 공간에서는 완전성을 얻어

Readonly는 최상위 쓰기를 막아

Code

External links

Exercise

Progress

댓글 0