TypeScript/VSCode异常：JS文件中const数组构建键名无IntelliSense提示

我在TypeScript中编写了一个泛型函数，用于根据传入的环境数组生成对应的判断方法：

export function buildEnvTests<T extends ReadonlyArray<string>>(environments: T) {
    const r = {} as {[K in T[number] as `is${K}`]: () => boolean};
    for (let e of environments) {
        r[`is${e}`] = () => '' === e;
    }
    return r;
}

在TypeScript文件中，用as const声明的常量数组调用该函数时，VS Code的IntelliSense能正确识别返回值的派生属性：

import { buildEnvTests } from "./test.js";

const x = ['A', 'B', 'C'] as const;
const r = buildEnvTests(x);
r. // 此处会正常显示isA、isB、isC属性选项

但在JavaScript文件中执行相同操作时，却没有任何IntelliSense提示：

import { buildEnvTests } from "./test.js";

const x = ['A', 'B', 'C'];
const r = buildEnvTests(x);
r. // 此处无任何IntelliSense提示

问题原因 #

JavaScript中普通数组会被TypeScript的类型检查器推断为string[]这种宽泛类型，而非具体的字面量数组类型。这导致buildEnvTests的泛型T无法推导出具体元素值，自然无法生成对应的isX属性提示。

解决方案 #

方案1：在JavaScript中使用as const断言

JavaScript同样支持as const语法，它会把数组标记为只读字面量数组，让TypeScript能准确推断每个元素的具体值：

import { buildEnvTests } from "./test.js";

const x = ['A', 'B', 'C'] as const;
const r = buildEnvTests(x);
r. // 现在会正常显示isA、isB、isC属性选项

方案2：使用JSDoc注释明确数组类型

如果不想用as const，可以通过JSDoc注释给数组指定具体的字面量类型，让泛型正确推导：

import { buildEnvTests } from "./test.js";

/** @type {const ['A', 'B', 'C']} */
const x = ['A', 'B', 'C'];
const r = buildEnvTests(x);
r. // 此处也会显示对应的属性提示

内容的提问来源于stack exchange，提问作者José Ramírez