TypeScript函数条件返回类型报错：null无法分配给条件类型

问题场景 #

我编写了一个映射CMS返回链接的TypeScript函数mapLink，通过泛型条件类型实现逻辑：

• 泛型参数T为false时，返回InternalLinkProps|null
• T默认值为true时，仅返回InternalLinkProps

但代码中if (!cached_url && !url) return null;语句触发类型错误：

Type 'null' is not assignable to type 'T extends false ? InternalLinkProps | null : InternalLinkProps'

解决方案 #

方案1：添加类型断言明确分支类型

在返回null的分支中，通过类型断言告诉TypeScript此时T必然为false，让返回值符合条件类型要求：

type LinkData = {
  cached_url?: string;
  url?: string;
  [key: string]: any;
};

type InternalLinkProps = {
  href: string;
  [key: string]: any;
};

function mapLink<T extends boolean = true>(data: LinkData): T extends false ? InternalLinkProps | null : InternalLinkProps {
  const { cached_url, url, ...rest } = data;
  
  if (!cached_url && !url) {
    // 断言该分支仅在T为false时触发，返回null符合类型
    return null as T extends false ? null : never;
  }
  
  return {
    href: cached_url || url!,
    ...rest
  } as InternalLinkProps;
}

方案2：使用函数重载明确返回类型

通过函数重载直接定义不同泛型参数对应的返回值，让编译器清晰识别调用场景的类型：

type LinkData = {
  cached_url?: string;
  url?: string;
  [key: string]: any;
};

type InternalLinkProps = {
  href: string;
  [key: string]: any;
};

// 重载1：默认调用（T=true），返回非空InternalLinkProps
function mapLink(data: LinkData): InternalLinkProps;
// 重载2：指定T=false，返回可空类型
function mapLink<T extends false>(data: LinkData): InternalLinkProps | null;
// 函数实现
function mapLink<T extends boolean = true>(data: LinkData): InternalLinkProps | null {
  const { cached_url, url, ...rest } = data;
  if (!cached_url && !url) return null;
  return {
    href: cached_url || url!,
    ...rest
  } as InternalLinkProps;
}

问题原因 #

TypeScript在函数内部无法解析未具体化的泛型条件类型，编译器无法推断T的具体值，因此直接返回null会与默认的非空返回类型冲突。通过类型断言或重载，我们可以明确不同分支对应的类型约束，解决类型不兼容问题。

内容的提问来源于stack exchange，提问作者Darkbound