TypeScript中扩展Express Response接口并保留泛型类型安全

要在扩展Express的Response接口时保留泛型类型安全，核心是复用Express原生Response接口的泛型参数，而非重新定义新的泛型接口。

正确的接口扩展方式 #

Express的Response本身就是泛型接口，我们只需在全局声明中为它添加sendOr404方法，并使用其原有泛型参数约束参数类型：

declare global {
  namespace Express {
    // 复用Response原有的泛型参数T（默认值为any）
    interface Response<T = any> {
      sendOr404(body: T | null): void;
    }
  }
}

// 确保文件被视为模块，避免全局声明冲突
export {};

验证类型安全 #

现在当你在路由中指定Response<MyResponseType>时，sendOr404会严格校验传入的body类型：

interface MyResponseType {
  data: {
    id: number;
    name: string;
  };
}

app.post('/example', (req, res: Response<MyResponseType>) => {
  // 符合类型，无错误
  res.sendOr404({ data: { id: 1, name: 'test' } });
  
  // 符合类型，返回404状态码
  res.sendOr404(null);
  
  // 触发类型错误：缺少data属性
  res.sendOr404({}); 
  
  // 触发类型错误：data结构不匹配
  res.sendOr404({ data: { id: '1', name: 'test' } });
});

原方案失效原因 #

你之前重新定义了新的Response<TRes>接口，这会覆盖Express原生的泛型Response接口，导致TypeScript无法正确关联路由中指定的泛型参数，最终TRes被默认推断为{}，失去类型校验能力。通过在全局Express命名空间下扩展原有Response接口，就能复用其泛型参数，实现类型安全。

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