TypeScript泛型函数返回类型在变量初始化与赋值时为何推断结果不同？

哈哈，这个问题我当初刚接触带默认值的泛型函数时也懵过！咱们一点点掰扯清楚——当你用带默认泛型类型的函数返回值直接初始化变量，和把它赋值给一个已经声明好类型的变量时，TypeScript的类型推断逻辑确实走了两条不同的路子。

先看你给出的简化示例代码：

function test<T extends Element = HTMLElement>(elementName:string):T{
  // 这里的实现只是占位，重点关注类型推断逻辑
  return document.createElement(elementName) as unknown as T;
}

咱们分别看两种场景的差异：

• 场景1：直接用函数返回值初始化变量
  比如写这样的代码：

  const div1 = test('div');
  

  这时候TypeScript找不到其他更明确的类型提示，就会直接使用泛型定义里的默认类型HTMLElement，所以div1的类型会被推断为HTMLElement。

• 场景2：赋值给已声明类型的变量
  要是你先给变量指定好类型再赋值：

  const div2: HTMLDivElement = test('div');
  

  这时候TypeScript会把你给变量指定的HTMLDivElement当成“目标类型”，反向去推导函数的泛型参数T。因为HTMLDivElement符合T extends Element的约束条件，所以这时候T就被推断为HTMLDivElement，而不是默认的HTMLElement了。

说白了，核心就是TypeScript的类型推断优先级：当有明确的目标类型（也就是你给变量声明的类型）时，它会优先用这个目标类型去匹配泛型参数；如果没有，就 fallback 到泛型的默认类型。

备注：内容来源于stack exchange，提问作者Pierre Henry