MST
星途 面试题库

面试题:TypeScript中number类型在泛型和元组中的复杂应用

设计一个泛型函数,该函数接收一个元组,元组中的元素类型不确定,但要求其中至少有一个元素是number类型。函数要能够对元组中的number类型元素进行特定的计算(例如求和),并返回结果。详细阐述在实现过程中如何处理泛型约束以及与number类型相关的类型推导问题。
35.2万 热度难度
前端开发TypeScript

知识考点

AI 面试

面试题答案

一键面试
function sumNumbersInTuple<T extends readonly unknown[] & { some: (element: unknown) => element is number }>(tuple: T): number {
    return tuple.reduce((acc, value) => {
        if (typeof value === 'number') {
            return acc + value;
        }
        return acc;
    }, 0);
}

泛型约束处理

  1. 类型约束 T extends readonly unknown[]:这确保了传入的参数是一个只读元组,其中元素类型初始设为 unknown,因为元组中元素类型不确定。
  2. 额外约束 & { some: (element: unknown) => element is number }:这是利用了类型谓词。some 方法在数组类型中存在,这里使用它来确保元组中至少有一个元素是 number 类型。如果元组中没有 number 类型元素,some 方法调用会返回 false,此时类型检查不通过,函数调用会报错。

与number类型相关的类型推导问题

  1. 类型缩小:在 reduce 回调函数中,通过 typeof value === 'number' 进行类型缩小。在这个条件块内,value 的类型会从 unknown 缩小为 number,这样就可以安全地进行数字运算,例如加法。
  2. 返回类型推导:由于 reduce 方法的初始值为 0(一个 number 类型),并且在回调函数中对符合条件的 number 类型元素进行加法运算,所以函数的返回类型会被推导为 number