如果在打字稿中传递可选参数，则更改函数返回类型答案

【问题标题】：Change function return type if optional argument is passed in typescript如果在打字稿中传递可选参数，则更改函数返回类型
【发布时间】：2021-07-11 23:42:09
【问题描述】：

我有以下功能：

const lists = {mylist: ["alpha", "beta", "gamme"]};

function foo(listName, element) { 
    if (typeof element !== 'undefined') {
        return !!lists[listName].find(x => x === element);
    }

    return [lists[listName], () => refreshLists()];
}

foo('mylist'); // returns [string[], () => any]
foo('mylist', 'alpha') // returns boolean

如您所见，该函数有 2 种不同的返回类型，具体取决于是否设置了参数 element。我怎样才能用打字稿正确地表示它，以便编辑器根据传递的参数选择正确的返回类型？

我目前的解决方案是这样的，但编辑器无法识别：

export type FnReturnType<T> = [T] extends [undefined] ? [string[], () => any] : boolean;

function foo<T extends string | undefined>(listName: string, element: T): FnReturnType<T> { 
    if (typeof element !== 'undefined') {
        return !!lists[listName].find(x => x === element);
    }

    return [lists[listName], () => refreshLists()];
}

如果typeof element !== undefined 否则返回布尔值[string[], () => any]，我如何创建一个条件类型？

【问题讨论】：

标签： typescript conditional-types

【解决方案1】：

使用function overloading。

您为不同的参数类型和返回类型编写两个单独的重载签名，然后编写将返回正确值的函数实现。

function foo(listName: string): [string[], () => any]; // overload signature #1
function foo(listName: string, element: string): boolean; // overload signature #2
function foo(listName: string, element?: string): boolean | [string[], () => any] { // function implementation
  if (typeof element !== 'undefined') {
      return !!lists[listName].find(x => x === element);
  } 
  
  return [lists[listName], () => refreshLists()];
}

查看playground

【讨论】：