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

실전 연습으로 익히는 고급 타입스크립트 기술

타입스페이스에서의 empty object 문제 풀어보기

해결된 질문

작성

193

export type Maybe<T extends string | boolean | number> = T;

type tests = [
  // @ts-expect-error
  Maybe<null>,
  // @ts-expect-error
  Maybe<undefined>,

  Maybe<string>,
  Maybe<false>,
  Maybe<0>,
  Maybe<"">
];

export type Maybe<T = string | boolean | number> = T;

type tests = [
  // @ts-expect-error
  Maybe<null>,
  // @ts-expect-error
  Maybe<undefined>,

  Maybe<string>,
  Maybe<false>,
  Maybe<0>,
  Maybe<"">
];

뭔가 extends와 = 가 같은것 같으면서도 다른가 봅니다. extends는 에러가 안나는데 =는 에러가 나네요

typescript

답변 1

애프터캠프

지식공유자

우선 =에 대해서 설명드리자면

Value space에서 default parameter 라고 생각하시면 되겠습니다.

예를 들면, foo 함수에 아무것도 넘기지 않고 호출하게 되면 hello가 리턴되는 것과 같이 Maybe에 아무것도 넘기지 않으면 string | number | boolean 타입이 T에 입력되게 됩니다.

function foo(a: string = "hello") {
  return a;
}

foo(); // 'hello'

반면에 extends는 value space에서 상속과 유사하다고 생각하시면 되는데요.

이걸 말로 풀어서 설명드리자면,

T에는 입력될 수 있는 타입은 string 집합에 포함되는 모든 것들, 예를 들면 "", "foo", "asdf", "fdfdf", 등등 무수히 많은 string literal types
또는
true, false
또는
number도 마찬가지로 숫자들의 집합 관점에서 생각했을 때 무수히 많은 숫자들이 있는데 그것들을 허용하겠다.

그래서 =와 extends의 차이가 존재합니다.

rhkdtjd_12

질문자

와우 친절한 설명 감사합니다. =와 extends에 대해서 이해가 부족 했는데, 덕분에 이해가 되었습니다!

인프런 커뮤니티 질문&답변

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