관리 메뉴

Jerry

[TIL] [타임어택9기][리뉴얼] 타입스크립트 올인원 : Part2. lib.es5.d.ts 분석- (16) : 하나는 걸리겠지(오버로딩) 본문

Front/Typescript

[TIL] [타임어택9기][리뉴얼] 타입스크립트 올인원 : Part2. lib.es5.d.ts 분석- (16) : 하나는 걸리겠지(오버로딩)

juicyjerry 2024. 3. 3. 21:30
반응형
하나는 걸리겠지(오버로딩)

 

 

 

 

타입 오버로딩 

같은 타입을 여러번 선언하는 것

function add(x: number, y: number): number
function add(x: string, y: string): string
function add(x: number | string, y: number | string): number | string {
    return x + y;
}

add(1, 2);
add(1, 2, 3);
add('1', '2');

// ex
filter<S extends T>(predicate: (value: T, index: number, array: readonly T[]) => value is S, thisArg?: any): S[];
filter(predicate: (value: T, index: number, array: readonly T[]) => unknown, thisArg?: any): T[];


declare를 선언하고 정의만하면 타입스크립트는 실제 코드는 다른 외부 어딘가에서 있다고 속일 수 있다고 생각한다, 바디 부분 구현 안 해도 됨

 

 

 

 

 

타입스크립트를 처음하고 잘 모르는데 add(1, 2);, add(1, 2, 3); 두 개다 하고 싶을 때 아래처럼하면 된다

declare function add(x: number, y: number): number
declare function add(x: number, y: number, z: number): number
declare function add(x: number, y: number, z?: number): number // good
declare function add(x: string, y: string): string

add(1, 2);
add(2, 3, 4);
add('1', '2');

 

 

 

 

 

인터페이스 오버로딩

interface Add {
    (x: number, y: number): number;
    (x: string, y: string): string;
}
const add: Add = (x: any, y: any) => x + y;

 x, y가 any더라도 타입스크립트에서 오버로딩 파트만 찾아주기 때문에 이럴 땐 사용해도 괜찮다. 

악영향을 미치는 것이 아니기 때문에

 

 

 

클래스 오버로딩

class A {
    add(x: number, y:number): number;
    add(x: string, y:string): string;
    add(x: any, y: any) {
        return x + y;
    }
}

const c = new A().add(1, 2);

 

 

 

 

 

 

 

반응형