如何使用 ES9 中的 Object.fromEntries 将 URLSearchParams 对象转换为对象

在前端开发中，我们经常需要将 URLSearchParams 对象（URL 查询参数）转换成 JavaScript 对象，以便进行操作。ES9 中新增了 Object.fromEntries 方法，该方法可以将一个类似数组的对象转换成一个真正的对象。在本文中，我们将探讨如何使用 Object.fromEntries 将 URLSearchParams 对象转换为对象。

URLSearchParams 对象

URLSearchParams 对象是 URL 中的查询参数部分。URLSearchParams 对象提供了一组方便的方法来获取和设置查询参数。例如，可以使用 URLSearchParams.get 方法获取指定的查询参数，使用 URLSearchParams.set 方法来设置查询参数。

以下是一个示例：

const querystring = new URLSearchParams('foo=1&bar=2');
console.log(querystring.get('foo')); // 1
console.log(querystring.get('bar')); // 2

Object.fromEntries 方法

Object.fromEntries 方法是 ES9 新增的一个方法，它接收一个可迭代对象，并返回一个对象。可迭代对象是一个数组或其他类似数组对象，它具有一个迭代器方法，可以用来遍历数组中的元素。例如，使用 Object.entries 方法可以将一个对象转换成一个数组。

以下是一个示例：

const obj = { foo: 1, bar: 2 };
const entries = Object.entries(obj);
console.log(entries); // [['foo', 1], ['bar', 2]]

然后，可以使用 Object.fromEntries 方法将该数组转换成一个对象：

const newObj = Object.fromEntries(entries);
console.log(newObj); // {foo: 1, bar: 2}

使用 Object.fromEntries 将 URLSearchParams 对象转换为对象

现在，我们已经了解了 URLSearchParams 对象和 Object.fromEntries 方法的用法。让我们将它们结合起来，来将 URLSearchParams 对象转换成对象。

以下是一个示例：

const queryString = new URLSearchParams('foo=1&bar=2');
const obj = Object.fromEntries(queryString.entries());
console.log(obj); // {foo: '1', bar: '2'}

在这个示例中，我们首先创建了一个 URLSearchParams 对象，然后使用 Object.fromEntries 方法和 queryString.entries 方法将其转换成一个对象。

总结

Object.fromEntries 方法是 ES9 中新增的一个方法，它可以将一个类似数组的对象转换成一个真正的对象。在我们的示例中，我们使用了 Object.fromEntries 方法和 URLSearchParams 对象上的 entries 方法来将 URLSearchParams 对象转换成了一个对象。这是一个非常方便和实用的技巧，在开发过程中，我们经常需要将 URLSearchParams 对象转换成对象进行操作。

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