제네릭 타입 기본값

제네릭 타입 기본값

함수 매개변수에 기본값을 설정할 수 있듯이 제네릭 타입 매개변수에도 기본 타입을 지정할 수 있습니다.

type SecondEvent<T> = {
    target: T
    type: string
}

새 이벤트를 만들려면 제네릭 타입을 SecondEvent로 명시적으로 한정하여 이벤트가 발생한 HTML 요소를 정확히 가리켜야 합니다.

type SecondEvent<T> = {
    target: T
    type: string
}

let buttonEvent: SecondEvent<HTMLButtonElement> = {
    target: secondEvent,
    type: string
}

특정 요소 타입을 알 수 없는 때를 대비해 SecondEvent의 제네릭 타입에 기본값을 추가할 수 있습니다.

type SecondEvent<T = HTMLElement> = {
    target: T
    type: string
}

T가 HTML 요소로 한정되도록 T에 경계를 추가해 보겠습니다.

type SecondEvent<T extends HTMLElement = HTMLElement> = {
    target: T
    type: string
}

이제 특정 HTML 요소 타입에 종속되지 않은 이벤트도 쉽게 만들 수 있습니다. 이 이벤트를 만들 때는 MyEvent의 T를 HTMLElement에 수동으로 한정하지 않아도 됩니다.

let buttonEvent: SecondEvent = {
    target: secondEvent,
    type: string
}

함수의 선택적 매개변수처럼 기본 타입을 갖는 제네릭은 반드시 기본 타입을 갖지 않는 제네릭 뒤에 위치해야 합니다.

// Good
type ThirdEvent<Type extends string, Target extends HTMLElement = HTMLElement> = {
    target: Target
    type: Type
}

// Bad
type ThirdEvent2<Target extends HTMLElement = HTMLElement, Type extends string>{ // 필수 형식 매개 변수는 선택적 형식 매개 변수 다음에 올 수 없습니다.ts(2706)
    target: Target
    type: Type
}