inflearn logo
강의

Khóa học

Chia sẻ kiến thức

Các kỹ năng TypeScript nâng cao được học thông qua thực hành thực hành

Cách tiếp cận đối tượng sử dụng loại Thương hiệu

이게 된다는걸 어떻게 판단할 수 있나요?

Đã giải quyết

60

csh0012319063

9 câu hỏi đã được viết

0

const db: { [postId: PostId]: Post; [userId: UserId]: User; } = {};

이 강의를 보지 않고 이게 된다는걸 판단할려면 어떻게 판단할 수 있나요?

모호한 질문 죄송합니다. 구체적으로 질문하고 싶은데 내공이 부족한 것 같습니다.

typescript

Câu trả lời 2

1

aftercamp

안녕하세요 답변이 늦었습니다.

제가 질문 의도를 이해를 못했는데 그냥 질문 그대로 답변을 드리자면

 

https://www.typescriptlang.org/play/?#code/MYewdgzgLgBAJgIwFwwN4wNoAcTQJJwoAKuUBAusaQNyYCuEApgE4EoCqTrclMnLtAL4wAvGkHUgA

이런 타입스크립트 플레이그라운드에서 타입이 맞냐 아니냐를 확인가능합니다. 그리고 굳이 타입에러를 없애겠다고 하면

type PostId = `post_${string}`;
  type UserId = `user_${string}`;

  type Post = {
    title: string;
    content: string;
  };

  type User = {
    name: string;
    email: string;
  };

  const db: { [postId: PostId]: Post; [userId: UserId]: User } = {};

  // 사용 예시
  db["post_1"] = { title: "Hello", content: "World" };
  db["user_1"] = { name: "Kim", email: "kim@example.com" };

이렇게 하면 되지 않을까 싶습니다.

0

csh0012319063

우선 답변 감사합니다.

강의 내용이 너무 좋고 배워가는게 많지만, 강의를 보지 않더라도 이런게 있고 사용가능하다는걸 판단할 수 있도록 연습을 해야된다고 생각해서 질문을 드리게 되었습니다.

 

  1. 인덱스 시그니처의 키 타입에 브랜드 타입이 사용가능하다는 판단을 어떻게 할 수 있는지 궁금합니다.
    인덱스 시그니처의 키 타입에 들어갈 수 있는 타입들이 string, number, symbol, 템플릿 리터럴, 해당 타입들의 조합인걸로 알고있는데 브랜드 타입을 사용하는게 생소한 것 같습니다.
    type Brand<K, T> = T & { __brand: K }; 처럼 &를 사용하기 때문에요.

  2. 객체 리터럴 내부에 인덱스 시그니처를 동시에 두개 사용하는 판단을 어떻게 할 수 있는지 궁금합니다.
    원래는 하나만 사용가능한걸로 알고있는데, 두개를 쓸수있다는 발상을 어떻게 할 수 있는지 궁금합니다.

  3. 알게 된 사용 방식은 실제 예시 코드를 작성해서 되는지 안되는지 확인하면 된다는걸로 이해했습니다.

 

 

1

aftercamp

안녕하세요 답변이 늦어서 죄송합니다.

 

  1. 결국 PostId는 string의 서브타입입니다. 제 생각의 흐름은 "아 PostId도 결국 string의 서브타입 (엄청 구체적인 타입, string이면서 _brand 속성도 가진 타입)이구나! 인덱스 시그니처 타입은 string | symbol | number... 가능하니까 string, symbol 등등 서브타입은 모두 가능하겠네?" 입니다. 원하시는 답변이 되셨을까요?

 type PostId = string & { __brand: "PostId" };
  1. 음 이건 저도 찾아보니까 타입스크립트 4.4부터 가능했더라고요. 아래 링크는 예시입니다. https://www.typescriptlang.org/play/?#code/AQ4FwTwBwU2AFA9gZzMAvMA3gKFOASzABsYAuYVAJwIDsBzAbj1AGNFawZOLq6mWAX2YtIsYAFVkMKhmwsQtAIYBbcpTA0GzfDBVKCxXpv47gwlgHpLwQC7jgGJrggDBbALl0A6Ny3a1UwJRSxgAG0AaxgICgADKBQwAH0AEiw+BkFIgF0KJF9BOSwLKxtbQGCawBHm4EACFuBADCHgQAjxwAHJ4EApUcARccAZOoB+YEAfdsADmuBAFNnAAw6vDl8AIwCFYLCI4GjYxOSTVIys2LMQUPCogFdpKmWU+jTMyUPGEGtgQAplwBZF22BATprADTmm5sAeccAJpvahPOEQA

    참조: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-4-4.html
    "final note on index signatures is that they now permit union types" 이 문장으로 찾아보세요!

0

csh0012319063

이해됐습니다 감사합니다!

0

communityai8509

안녕하세요, 인프런 AI 인턴입니다. 정중한 몽구스님.

주어진 코드에서 const db는 객체의 형태로 보이며, TypeScript에서 객체의 키를 동적으로 지정할 수 있는 방법들을 활용하고 있는 것으로 보입니다. 이때 [postId: PostId][userId: UserId]는 TypeScript의 인덱스 시그니처를 나타냅니다.

TypeScript에서는 객체의 키 타입을 특정하여 인터페이스를 정의할 수 있습니다. 예를 들어, 객체의 키를 PostId 타입과 UserId 타입으로 각각 지정하고, 그에 대한 값 타입을 Post와 User로 정의한 것입니다. 하지만, TypeScript에서 인덱스 시그니처는 동일한 타입으로만 선언될 수 있습니다. 다양한 타입을 키로 사용하고 여러 타입을 값으로 사용하려면 두 번 이상 선언이 필요합니다.

이런 점에서 const db 선언은 오류가 발생할 가능성이 있습니다. 실제로 사용할 때 각각의 ID 타입을 다른 방식으로 처리하거나 접근 방법을 다시 설정해야 할 수도 있습니다.

비슷한 주제나 문제에 대한 강의나 FAQ가 있다면 아래와 같이 이전의 질문들을 참조해보실 수 있습니다:

이러한 방식으로 해당 코드가 가능할지 결정하기 위해서는 TypeScript의 문법 규칙을 잘 알고 있어야 합니다. TypeScript 문서를 참조하시거나 관련 강의를 통해 조금 더 구체적인 타입 시스템의 동작을 이해하실 것을 권장 드립니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

연습문제 강의 확인 부탁드립니다.

0

80

2

object key 질문드립니다.

0

66

1

행운 닉네임 등록부탁드립니다!

0

136

2

각 강의에 대한 설명 링크 404에러

0

69

2

행운문제 닉네임 등록 요청드립니다

0

64

2

블로그 링크 문제

1

122

1

제네릭과 사용자 정의 타입 가드에 관한 질문

1

168

1

제네릭 타입 제한을 하는것이 어떤 장점이 있을까요 ?

1

140

1

행운문제 닉네임 등록 신청합니다!

0

111

2

행운문제 테스트 유저 이름 입력 요청

0

129

2

행운문제 닉네임 입력 요청

1

158

2

행운문제 테스트 유저 이름 입력 요청

1

140

2

설명 블로그에 대한 질문

2

129

3

행운동전!

0

115

2

행운문제 테스트 유저 이름 입력 요청

0

122

1

행운 테스트 문제 400 에러

0

177

2

행운 테스트 문제 (존재하지 않는 유저입니다.)

1

203

2

행운테스트 동전이용!!

0

209

2

연습문제 링크 이슈

2

223

3

화살표 함수와 일반 함수의 매개변수 추론 관련

1

308

2

제네릭을 활용해서 정답을 맞춰보았습니다!

1

332

2

cache 강의 질문

1

211

1

Record의 제네릭은 자동적으로 바뀌나요?

0

379

2

extends와 = 의 차이는 무엇인가요?

1

222

1