Typescript를 사용한 Typesafe 다중 반환 유형.

5791 단어 magictypescript
Typescipt 유형과 런타임 값은 두 가지 별도 수준이며 기본적으로 값을 기반으로 TypeScript 조건을 작성하는 것은 지원되지 않지만 해결책이 있습니다.

제가 이루고자 하는 것은 다음과 같습니다. 함수 매개변수에 입력된 값에 따라 함수 반환 유형이 변경됩니다.

function getUsers(withPagination: boolean): IUser[] | IPaginatedUsers { 
  // ... 
  return users; 
}


이 함수의 목적은 api에서 사용자를 반환하는 것입니다. withPagination이 true이면 사용자 배열을 페이지 매김으로 래핑하고 false이면 사용자 배열만 반환합니다(예시).

문제는 런타임이 "withPagination"변수를 기반으로 반환 값을 표시한다는 것입니다. 반환 값은 구체적이지 않지만 반환 값이 무엇인지 알고 있기 때문에 두통이 발생할 수 있습니다.

한 가지 해결책은 반환 값을 일반적으로 지정하는 것이지만 그다지 편리하지 않고 엉망이 될 수 있습니다. 다른 해결책은 두 개의 개별 함수를 만드는 것입니다. 이 경우에는 더 나을 수 있지만 코드 중복을 유발할 수 있습니다.

function getUsers(): IUser[] { 
  // ... 
  return users; 
}

function getUserswithPagination(): IPaginatedUsers { 
  // ... 
  return users; 
}



함께 유지하고 typesafe 방식으로 2개 이상의 다른 반환값을 구현하려면 다음과 같이 할 수 있습니다.

interface IUser {
    name: string,
    age: number,
}

interface IPaginated<T> {
    data: T[],
    meta: {
        page: number,
        limit: number,
        totalPages: number
    }
}

interface IResponseOptions {
    withPagination: boolean
}

const DEFAULT_RESPONSE_OPTION = {
    withPagination: true
}

type UserResultType<T extends IResponseOptions> = T extends {
    withPagination: true
} ? IPaginated<IUser> : IUser[];


function getUsers<T extends IResponseOptions>(withPagination: T = DEFAULT_RESPONSE_OPTION as any): UserResultType<T> { 
  // fetch data..
  return "something" as any as UserResultType<T>; 
}



getUsers({withPagination: true}); // return IPaginated<IUser>
getUsers({withPagination: false}); // return IUser[];
getUsers(); // returns bsed on DEFAULT_RESPONSE_OPTION: IPaginated<IUser>


좋은 웹페이지 즐겨찾기