TypeScript中NetworkInformation类型缺失属性报ts(2339)错如何解决

你遇到的报错是因为TypeScript内置的NetworkInformation类型定义没有包含实验性的effectiveType、downlink属性，你可以通过以下几种方式解决：

方式1：临时类型断言（快速解决） #

直接将navigator.connection断言为any跳过类型检查，适合临时调试使用：

const info: string[] = ['Downloading...'];
if ('connection' in window.navigator) {
  const conn = window.navigator.connection as any;
  info.push(`Connection Type: ${conn.effectiveType}`);
  if ('downlink' in conn) {
    info.push(`Speed: ${conn.downlink} MB/s`);
  }
}

方式2：扩展全局类型定义（推荐长期使用） #

在你项目的类型声明文件（比如global.d.ts，如果没有可以新建一个，放到tsconfig.json的include路径范围内）中补充NetworkInformation的缺失属性，配置后还能获得完整的类型提示：

// global.d.ts
interface NetworkInformation {
  effectiveType?: 'slow-2g' | '2g' | '3g' | '4g';
  downlink?: number;
  // 还可以根据需要补充rtt、saveData等其他实验性属性
}

interface Navigator {
  connection?: NetworkInformation;
}

添加完成后重启TypeScript服务，原有业务代码的报错会自动消失，不需要额外修改业务逻辑。

方式3：单行忽略类型检查（不推荐） #

如果仅需要临时跳过当前行的检查，可以在报错行上方添加// @ts-ignore注释：

const info: string[] = ['Downloading...'];
if ('connection' in window.navigator) {
  // @ts-ignore
  info.push(`Connection Type: ${navigator.connection.effectiveType}`);
  if ('downlink' in window.navigator.connection) {
    // @ts-ignore
    info.push(`Speed: ${navigator.connection.downlink} MB/s`);
  }
}

这种方式会屏蔽当前行所有类型错误，没有类型校验能力，不建议长期使用。

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