为何TypeScript循环中索引数组会出现"并非所有成员可调用"错误？

先定义一个元素为字符串或返回字符串的函数的数组：

const arr: (string | (() => string))[] = [/* ... */]

直接访问固定索引（比如arr[0]）时，类型窄化正常工作：

// 此代码正常运行
const value = typeof arr[0] === 'string' ? arr[0] : arr[0]()

但用循环变量索引访问时，TypeScript会抛出错误：“并非所有类型为'string | (() => string)'的成员都可调用”

for (let i = 0; i < arr.length; i++) {
    // 报错：“并非所有成员可调用”
    const value = typeof arr[i] === 'string' ? arr[i] : arr[i]()
}

即使把索引赋值给const变量，问题依然存在：

for (let i = 0; i < arr.length; i++) {
    const j = i
    // 仍报错
    const value = typeof arr[j] === 'string' ? arr[j] : arr[j]()
}

但如果先把数组元素赋值给一个变量，类型窄化就正常了：

for (let i = 0; i < arr.length; i++) {
    const item = arr[i]
    // 此代码正常运行
    const value = typeof item === 'string' ? item : item()
}

核心原因：TypeScript的类型窄化范围限制 #

TypeScript的类型窄化（Type Narrowing）只对直接引用的局部变量生效，而通过索引动态访问的数组元素，TypeScript的静态分析无法保证两次访问arr[i]时指向的是同一个元素——虽然JS运行时里是同一个，但TypeScript会假设数组可能在两次访问之间被外部修改，因此无法关联两次访问的类型判断结果。

• 当你写typeof arr[i] === 'string'时，TypeScript只能窄化当前这一次访问的arr[i]类型，但下一次访问arr[i]时，它会认为元素类型还是原始的联合类型string | (() => string)，自然会抛出“不可调用”的错误。
• 而将arr[i]赋值给const变量item后，TypeScript可以确定这个变量的类型不会被修改，因此对item做类型判断后，后续的item引用会被正确窄化。

至于固定索引arr[0]能正常工作，是因为TypeScript认为数组固定索引对应的元素类型是稳定的，两次访问会被关联起来，类型窄化逻辑能正常生效。

常用解决方式 #

• 最直接的方案：先将数组元素赋值给局部变量，再对变量做类型判断和窄化（就是示例中可行的写法）。
• 使用数组迭代方法：比如forEach，回调函数的参数会被自动正确推断类型，无需额外处理：

arr.forEach(item => {
    const value = typeof item === 'string' ? item : item()
})

内容的提问来源于stack exchange，提问作者Nikolas Stevenson-Molnar