在 ES11 中，推出了一个新的 API：Object.fromEntries。它的作用是将一个由键值对组成的数组转换成一个对象。这个 API 实际上是将 Object.entries API 的逆操作，所以在介绍 Object.fromEntries API 之前，我们先来了解一下 Object.entries API。
Object.entries API
Object.entries API 可以将一个对象的键值对转换为一个数组，其中该数组中的每一项都是一个由两个元素组成的数组，第一个元素是键名，第二个元素是键值。我们来看一个例子：
----- --- - - ----- ----- ---- -- -- ----- ------- - -------------------- --------------------- -- - -------- ------ ------- --- -
上述代码中，我们先定义了一个包含 name 和 age 两个属性的对象 obj，然后使用 Object.entries(obj) 将它转换为了一个数组 entries。
Object.fromEntries API
Object.fromEntries API 的作用正好相反，可以将一个由键值对组成的数组转换生成一个对象。这个数组必须是由一些由两个元素组成的数组，第一个元素是键名，第二个元素是键值。我们来看一个例子：
----- ------- - - -------- ------ ------- --- -- ----- --- - ---------------------------- ----------------- -- - ----- ----- ---- -- -
上述代码中，我们定义了 entries 数组，该数组中的每一项都是一个由两个元素组成的数组。然后我们使用 Object.fromEntries(entries) 将其转换成了一个对象 obj。
如何正确使用 Object.fromEntries API
了解了 Object.fromEntries API 的作用后，我们来看一下它使用中的注意事项。
1. 键名必须是字符串类型
由于对象属性名必须是字符串类型，因此在使用 Object.fromEntries API 时，键名必须是字符串类型。否则会抛出一个 TypeError 错误。如下面的例子：
----- ------- - - --- ------ --- --- -- ----- --- - ---------------------------- -- ------------- -------- --- ---- -- - ------ -----
上面的代码中，我们定义了一个由两个元素组成的数组 entries，第一个元素是数字类型1和2，而不是字符串类型。这样在使用 Object.fromEntries API 时就会报错。
2. 如果键名重复会覆盖旧值
如果一个由键值对组成的数组中，有多个数组元素的第一个元素相同，那么使用 Object.fromEntries API 时，会将最后一个键值对的值作为对象属性的值，之前的值将被覆盖。如下面的例子：
----- ------- - - -------- ------ ------- ---- -------- ----- -- ----- --- - ---------------------------- ----------------- -- - ----- ----- ---- -- -
上面的代码中，我们定义了一个由键值对组成的数组 entries，其中第一个元素为 name 的数组出现了两次。最终使用 Object.fromEntries API 时，name 的属性值被后面的值'李四'覆盖掉了。
示例代码
最后，我们来看一个完整的示例代码：
----- ------- - -
-------- ------
------- ----
----------- ------ -------
-------- -
---- -----
---- ----
--
--
----- --- - ----------------------------
-----------------
--
-
----- -----
---- ---
-------- ------ ------
----- - ---- ----- ---- ---- -
-
--上面的例子中，我们定义了一个数组 entries，该数组中包含了一些不同类型的键值对（包含字符串、数字、数组、对象等）。最终使用 Object.fromEntries API 将这个数组转换成了一个对象 obj，并输出到控制台。
结论
通过本篇文章，我们学习了 ES11 中的 Object.fromEntries API，知道了它的作用，以及使用中需要注意的事项。在实际项目中，我们可以根据实际情况使用 Object.fromEntries API 将数组转换成对象，从而更好地进行后续操作。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/672a090fddd3a70eb6cf0278