타입 안전 TypeScript 사전: 인덱스 시그니처 및 Record

Key Takeaways

1. TypeScript 사전은 인덱스 시그니처 또는 Record<K, V> 유틸리티 유형을 사용하여 정의됩니다.
2. Record와 함께 특정 키 유형을 사용하면 타입 안전성과 IDE 지원이 향상됩니다.
3. 사전으로 작업할 때 반복 및 불변성은 중요한 고려 사항입니다.

TypeScript는 JavaScript의 상위 집합으로서 JavaScript 개발에 강력한 타입 검사 기능을 제공합니다. 일반적으로 사용되는 데이터 구조 중 하나는 사전이며, 맵 또는 동적 키가 있는 객체라고도 합니다. 이 기사에서는 TypeScript에서 사전을 정의하고 사용하는 방법, 모범 사례 및 타입 안전 패턴을 살펴봅니다.

TypeScript에서 사전이란 무엇입니까?

TypeScript에서 사전은 일반적으로 키-값 쌍을 저장하는 데 사용되는 객체이며, 키는 일반적으로 문자열(또는 때로는 숫자)이고 값은 모든 유형이 될 수 있습니다.

예를 들어:

const scores: { [key: string]: number } = {
  Alice: 95,
  Bob: 82,
  Charlie: 78
};

이 경우 scores는 키가 학생 이름(문자열)이고 값이 숫자 점수인 사전입니다.

사전 타입 정의

다음과 같은 여러 가지 방법으로 재사용 가능한 사전 타입을 정의할 수 있습니다.

1. 인덱스 시그니처 사용

type StringToNumberMap = {
  [key: string]: number;
};

const ages: StringToNumberMap = {
  John: 30,
  Jane: 25
};

이 방법은 유연하지만 가능한 키를 제한하지 않으므로 오타가 발생할 수 있습니다.

2. Record 유틸리티 타입 사용

TypeScript는 내장된 Record<K, V> 유틸리티 타입을 제공합니다.

const userRoles: Record<string, string> = {
  admin: 'full-access',
  guest: 'read-only'
};

키가 알려져 있고 고정되어 있는 경우 특정 문자열 리터럴을 사용하는 것이 좋습니다.

type UserRole = 'admin' | 'guest';

const userPermissions: Record<UserRole, string> = {
  admin: 'all',
  guest: 'limited'
};

이렇게 하면 타입 안전성과 IDE 자동 완성 지원이 향상됩니다.

선택적 및 읽기 전용 사전 값

값을 선택 사항 또는 읽기 전용으로 표시할 수 있습니다.

type UserSettings = {
  [key: string]: string | undefined;
};

const settings: UserSettings = {
  theme: 'dark',
  language: undefined
};

또는 Record 사용:

type FeatureFlags = Record<string, boolean | undefined>;

읽기 전용 사전의 경우:

const config: Readonly<Record<string, string>> = {
  version: '1.0.0',
  env: 'production'
};

사전 반복

다음과 같이 사전의 키를 반복할 수 있습니다.

for (const key in scores) {
  if (scores.hasOwnProperty(key)) {
    console.log(`${key}: ${scores[key]}`);
  }
}

또는 더 나은 제어를 위해 Object.entries()를 사용합니다.

Object.entries(scores).forEach(([name, score]) => {
  console.log(`${name}: ${score}`);
});

일반적인 사용 사례

• ID별 데이터 캐싱
• 단어 빈도수 계산
• 구성 옵션
• 열거형과 문자열 간의 매핑

결론

TypeScript의 사전은 다재다능하고 필수적인 데이터 구조입니다. 인덱스 시그니처 또는 Record 유틸리티 유형을 사용하여 TypeScript의 정적 타이핑 시스템과 잘 통합되는 유연하고 타입 안전 사전을 구축할 수 있습니다. 사전 타입의 미묘한 차이를 이해하면 더 강력하고 유지 관리 가능한 코드를 작성하는 데 도움이 됩니다.

FAQs

TypeScript에서 인덱스 시그니처와 Record의 차이점은 무엇입니까?

인덱스 시그니처는 동적 키를 허용하는 반면 Record는 미리 정의된 키로 더 엄격한 타이핑을 제공합니다.

TypeScript 사전을 읽기 전용으로 만들려면 어떻게 해야 합니까?

값 수정을 방지하려면 사전 타입을 Readonly<Record<K, V>>로 래핑합니다.

사전 값이 TypeScript에서 선택 사항이 될 수 있습니까?

예, 값에 대해 string | undefined를 사용하거나 ?를 사용하여 선택 사항으로 정의할 수 있습니다.

We are Leapcell, your top choice for hosting Node.js projects.

Leapcell is the Next-Gen Serverless Platform for Web Hosting, Async Tasks, and Redis:

Multi-Language Support

• Develop with Node.js, Python, Go, or Rust.

Deploy unlimited projects for free

• pay only for usage — no requests, no charges.

Unbeatable Cost Efficiency

• Pay-as-you-go with no idle charges.
• Example: $25 supports 6.94M requests at a 60ms average response time.

Streamlined Developer Experience

• Intuitive UI for effortless setup.
• Fully automated CI/CD pipelines and GitOps integration.
• Real-time metrics and logging for actionable insights.

Effortless Scalability and High Performance

• Auto-scaling to handle high concurrency with ease.
• Zero operational overhead — just focus on building.

Explore more in the Documentation!

Follow us on X: @LeapcellHQ