为何TypeScript中`Array.isArray`因变量访问方式不同表现有差异？

先看这段代码里的困惑：

type ArgParam = { [parameter: string]: string | string[] }

function testFunc (parameters: ArgParam, params: string[]) {
    params.forEach((param) => {
        if (Array.isArray(parameters[param])) {
          const test = parameters[param]
         //     ^? -> 类型仍是 `string | string[]` —— 明明刚判断过是数组！
        }
        if (Array.isArray(parameters['some string'])) {
          const test = parameters['some string']
         //     ^? -> 类型是 `string[]` —— 符合预期
        }
    })
}

问题原因 #

核心在于TypeScript对字符串索引签名的类型推断逻辑：

• 字面量索引：当用'some string'这种明确的字面量字符串访问对象时，TypeScript能直接关联到索引签名定义，一旦通过Array.isArray判断，就能确定该键对应的值类型是string[]，自动完成类型收窄。
• 变量索引：param是一个字符串变量，而ArgParam的索引签名允许任意字符串键对应string或string[]类型。TypeScript无法确定这个变量指向的键在对象中实际存储的是哪种类型——静态类型检查无法预判变量对应的具体键，因此无法完成类型收窄。

解决办法 #

如果需要让变量索引的场景也能正确收窄类型，可以用以下两种方式：

1. 自定义类型守卫
   写一个明确的类型守卫函数，帮助TypeScript识别类型：

type ArgParam = { [parameter: string]: string | string[] }

function isStringArray(value: string | string[]): value is string[] {
  return Array.isArray(value);
}

function testFunc (parameters: ArgParam, params: string[]) {
    params.forEach((param) => {
        const value = parameters[param];
        if (isStringArray(value)) {
          const test = value; // 类型为 string[]
        }
    })
}

2. 更精确的类型定义
   如果能提前确定params中的键对应的类型，可以修改类型约束，比如用联合类型明确键：

type ArgParam = {
  name: string;
  tags: string[];
  [key: string]: string | string[];
}

function testFunc (parameters: ArgParam, params: Array<'tags'>) {
    params.forEach((param) => {
        if (Array.isArray(parameters[param])) {
          const test = parameters[param]; // 类型为 string[]
        }
    })
}

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