JavaScript Map 正在更新！

这篇文章最初发表在laurieontech.dev上

让我们在 JavaScript 中引入一个新的（潜在的）语法！

什么是地图？

Map 是 JavaScript 中你可能从未听说过的一个数据结构！当你想到 时map，你可能会想到Array.prototype.map。

但是 Map 不同。Map 是 JavaScript 中保存键值对的对象。

等一下...这与对象有何不同？！

它们有一些相似之处。事实上，在 Map 被添加到语言中之前，使用 Object 代替 Map 并不罕见。然而，它们也存在一些差异，主要有：

• Map 没有原型，所以除非你创建键，否则根本没有键
• 映射键可以是任何东西，包括函数或对象
• Map 记住键的插入顺序
• 地图自带size()功能
• Map 是可迭代的
• 当频繁添加或删除键值对时，Map 的性能会更高

添加值

您可以创建一个 Map 并使用该函数添加键值对set。

let example = new Map()
example.set('test', 'value')
// example is Map { 'test' => 'value' }

但是，如果您使用相同的键设置某些内容，则该值将被覆盖。

example.set('test', true)
// example is Map { 'test' => true }

如果您想对特定的键进行操作，您需要确保它在那里，如果不存在则添加它，然后对其进行操作。

if (!example.has('test')) {
  example.set('test', 'new value')
}
example.get('test').myFunctionForMessingWithThisKeyEntry()

而且这种情况并非唯一。你可能只想在键缺失时插入，或者只在键存在时更新等等。如果不用每次都进行存在性检查和使用set，那就太好了。get

插入更新

upsert让这一切变得更容易！

upsert是 Map 原型上的一个函数。它接受三个参数。

第一个参数是您想要使用的密钥。

第二个是您想要对现有值进行操作的函数（如果找到）。

第三个是如果密钥当前不存在时您希望发生的情况。

所以我们的之前的例子就变成了这样。

example
  .upsert('test', undefined, () => 'new value')
  .myFunctionForMessingWithThisKeyEntry()

在这种情况下，如果现有值已经存在，我们将保留它，因此undefined。

或者，我们有这个例子。

example.upsert('test', old => old.someOperation(), undefined)

这里，old相当于map.get('test')，我们正在对其进行操作。如果键不存在，则不执行任何操作。

通过这两个例子可以清楚地看出，使用 upsert 有很多种不同的可能性。

TC39 第 2 阶段

该提案目前处于 TC39 流程的第二阶段。如果您有兴趣参与讨论，欢迎加入！