ES9 中的 Object.fromEntries 方法,轻松将数组转换为对象

在 JavaScript 中,将数组转换为对象是一个常见的任务,通常需要使用循环和条件语句。但是自从 ES9 中引入了 Object.fromEntries() 方法,我们就可以以更简单、更少的代码将数组转换为对象了。

Object.fromEntries() 方法

Object.fromEntries() 方法是 ES9 中引入的一个新方法,它接收一个可迭代对象(如数组),并返回一个新的对象。该方法要求传入的可迭代对象中的每个元素都必须是一个键值对数组,即数组中每个元素都包含两个元素,第一个是键,第二个是值。Object.fromEntries() 方法会将每个键值对数组中的键和值转换为新的对象的属性和值,并返回转换后的对象。

用法示例

让我们看一下这个方法的使用示例。假设我们有一个包含多个键值对数组的数组,我们想将它们转换为一个对象,其中每个数组的第一个元素将成为对象的属性名,第二个元素将成为属性值。

----- --- - -------- --- ------- --- --------- ----

----- --- - ------------------------

----------------- -- - ---- -- ---- -- ------ - -

在上面的示例中,我们首先定义了一个包含多个键值对数组的数组 arr。然后我们调用 Object.fromEntries() 方法并将 arr 作为参数传递给它。Object.fromEntries() 方法将 arr 中的每个键值对数组中的第一个元素作为属性名,将第二个元素作为属性值,并将它们添加到新创建的对象 obj 中。最后,我们使用 console.log() 方法打印转换后的对象 obj

其他用法

与 Object.entries() 方法结合使用

要将对象转换为数组,我们可以使用 Object.entries() 方法。而与 Object.entries() 方法结合使用,Object.fromEntries() 方法还可以轻松地将包含键值对数组的数组转换回对象。下面是一个示例:

----- --- - - ---- -- ---- -- ------ - --

----- --- - --------------------

----------------- -- -------- --- ------- --- --------- ---

----- ------ - ------------------------

-------------------- -- - ---- -- ---- -- ------ - -

在这个示例中,我们首先定义了一个包含多个属性的对象 obj。然后我们调用 Object.entries() 方法将 obj 转换为一个键值对数组的数组 arr。然后,我们调用 Object.fromEntries() 方法将 arr 转换回一个新的对象 newObj,该对象与原始对象 obj 相同。最后,我们使用 console.log() 方法打印转换后的数组 arr 和对象 newObj

对象属性名的计算

由于 Object.fromEntries() 方法要求传入的可迭代对象中的每个元素都必须是一个键值对数组,因此我们可以使用计算的属性名来创建这些数组。下面是一个使用计算属性名的示例:

----- --- - -------
----- ----- - -------

----- --- - ------ --------

----- --- - ------------------------

----------------- -- - ----- ------ -

在这个示例中,我们首先使用变量 keyvalue 定义了要向数组中添加的键和值。然后,我们创建一个包含 [key, value] 的数组。最后,我们调用 Object.fromEntries() 方法将数组转换为一个包含一个属性 name 的对象。

结论

在 ES9 中,Object.fromEntries() 方法提供了一种更简单、更少的代码方式将包含键值对数组的数组转换为对象。当我们需要将对象转换为数组时,我们可以结合使用 Object.entries()Object.fromEntries() 方法。此外,我们还可以使用计算的属性名来创建键值对数组,以更加灵活地构建我们需要的对象。

无论您是新手还是有经验的 JavaScript 开发人员,掌握 Object.fromEntries() 方法都是值得努力学习的。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/672344922e7021665e0f2780