ES9 特性之 "Object.fromEntries" 详解

在 ES9 中，新增了一项非常实用的特性：Object.fromEntries。这是一个比较简单，但非常实用的 API，本文将详细讲解它的使用方法和实际应用。

Object.fromEntries 概述

“Object.fromEntries”是一个全局函数，它接收一个由键值对组成的数组作为参数，并返回一个由这些键值对组成的对象。下面是一个示例：

const arr = [['foo', 'bar'], ['baz', 42]];
const obj = Object.fromEntries(arr);
console.log(obj); // { foo: 'bar', baz: 42 }

Object.fromEntries 与 Object.entries 的关系

在介绍 Object.fromEntries 更深入的用法之前，我们有必要谈谈 Object.entries。 Object.entries 是一个以相同键值对数组形式返回对象自身可枚举属性的方法。这就意味着，如果你有这样一个对象：

const obj = { foo: 'bar', baz: 42 };

你可以通过 Object.entries 方法将它转换为具有以下形式的数组：

[['foo', 'bar'], ['baz', 42]];

请注意，每个子数组都包含一个属性的键和值。这样的数组非常适合使用 Object.fromEntries 进行转换。

Object.fromEntries 的实际应用

现在，我们已经知道了 Object.fromEntries 的基本用法和 Object.entries 之间的关系，接下来，我们来看看 Object.fromEntries 的实际应用。

将 URLSearchParams 转换为对象

URLSearchParams 对象提供了一种方便的方式来处理 URL 查询字符串。通常，我们可以将一些查询参数添加到 URL 中，例如：

const searchParams = new URLSearchParams('?foo=bar&baz=42');

现在，我们需要将 URLSearchParams 转换为一个对象，以便我们可以更方便地处理查询参数。这时， Object.fromEntries 就派上用场了：

const searchParams = new URLSearchParams('?foo=bar&baz=42');
const obj = Object.fromEntries(searchParams);
console.log(obj); // { foo: 'bar', baz: '42' }

将对象转换为 URLSearchParams

我们还可以将一个对象转换回 URLSearchParams 对象：

const obj = { foo: 'bar', baz: 42 };
const searchParams = new URLSearchParams(Object.entries(obj));
console.log(searchParams.toString()); // "foo=bar&baz=42"

结论

在这篇文章中，我们讲解了 ES9 新增的 Object.fromEntries API，并详细讨论了它的基本用法及其与 Object.entries 之间的关系。此外，我们还介绍了 Object.fromEntries 在实际应用中的用途，包括将 URLSearchParams 转换为对象和将对象转换为 URLSearchParams。希望这篇文章能够帮助你更好地了解和利用 ES9 的 Object.fromEntries 特性。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67203f642e7021665e015917