为何TS/ESlint允许方括号访问Map？如何配置禁止该用法？

示例代码 #

const m = new Map<number, string>();
m.set(1, 'one');
console.log(m.get(1)); // 正确访问键1对应值的方式
console.log(m[1]); // 错误用法——为何被允许？如何阻止该用法？

运行输出 #

one
undefined

问题解析 #

为何允许方括号访问Map？ #

Map是JavaScript内置对象，JS中所有对象都支持方括号访问属性（这是对象的基础特性）。但Map的键值对并非存储为对象的自身属性，而是存在独立的内部存储结构中。m[1]本质是访问Map实例的属性（属性名会被自动转为字符串"1"），而非Map的键，因此返回undefined。

TypeScript默认允许这种操作，因为它遵循JS的灵活性，默认不限制对象的属性访问——除非你开启严格的类型检查规则，或通过ESLint规则主动约束。

如何阻止这类错误用法？ #

有两种可行方案：

1. 启用ESLint专属规则

使用@typescript-eslint/prefer-map-get规则，该规则会检测到对Map的方括号访问，并强制要求改用get()方法。

• 确保已安装@typescript-eslint/eslint-plugin和@typescript-eslint/parser
• 在.eslintrc.json中添加规则配置：

{
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint"],
  "rules": {
    "@typescript-eslint/prefer-map-get": "error"
  }
}

配置完成后，ESLint会对m[1]这类用法抛出错误，提示你使用m.get(1)。

2. 强化TypeScript类型检查

在tsconfig.json中开启strict: true，同时可以额外开启noImplicitAny和strictNullChecks。虽然TS默认不会直接禁止Map的方括号访问，但严格模式会让类型检查更严格，配合ESLint规则可以形成双重约束。

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