JavaScript Set 和不可变 Set 的区别

Question

我最近遇到了一个问题，我最终使用了 JavaScript Set 对象，而没有使用

new

运算符进行实例化。我在我的项目中使用不可变，并希望使用那里的

Set

构造，但我忘记导入它。

正如预期的那样，代码崩溃了，因为代码期望我写

let set = new Set()

而不是仅仅

let set = Set()

。

是否有任何可用的 es-lint 规则可以帮助捕获此类问题？

Answer 1

您可以添加自定义无限制全局规则：

"no-restricted-globals": [
    "error",
    {
        "name": "Set",
        "message": "Use window.Set or add an eslint-ignore if native Set is what you want"
    },
    {
        "name": "Map",
        "message": "Use window.Map or add an eslint-ignore if native Map is what you want"
    }
],

我们的项目一开始就不一致地使用了 ImmutableJS，所以我们最终遇到了很多这样的问题。最糟糕的情况之一是有人将代码从一个文件迁移到另一个文件，并且同时使用了 JavaScript Set 和 Immutable Set。突然，未触及的代码开始失败，因为

import { Set } from 'immutable';

遮蔽了本机类。

有两件事帮助我们发现这些问题：

• 每当我们有意想要使用原生 JavaScript 类型时，我们都会在它们前面加上技术上无用但视觉上明显的

  window

  范围：

  new window.Set()

• 由于它是一个 React 项目，因此我们在所有组件上使用了 prop-types 和 react-immutable-proptypes。但永远不要使用 PropTypes.object，该规则几乎总是正确的！