Object.entries 是 ES6 新增的对象方法，它可以返回一个对象自身可枚举属性的键值对的数组，其中键和值分别以数组的形式存储。本文将介绍使用 Object.entries 方法的一些技巧，帮助前端开发者更好地处理对象数据。
常规使用方法
Object.entries 方法接收一个对象作为参数，它将返回一个键值对数组：
const object = { a: 1, b: 2, c: 3 };
const arr = Object.entries(object);
console.log(arr); // [["a", 1], ["b", 2], ["c", 3]]根据上述代码，返回的 arr 数组中，每个元素代表了对象自身可枚举属性的键值对，其中第一个元素为键，第二个元素为值。
使用 forEach 遍历键值对数组
我们可以通过 forEach 方法遍历 Object.entries 方法返回的键值对数组，并对每个键值对进行处理：
arr.forEach(([key, value]) => {
console.log(`${key}: ${value}`);
});
// 输出：
// "a: 1"
// "b: 2"
// "c: 3"通过使用解构赋值，我们可以方便地获取到当前键值对的键和值。
将键值对数组转换为 Map 对象
除了遍历键值对数组，我们还可以将其转换为 Map 对象。使用 Object.entries 方法和 Map 构造函数，我们可以很方便地完成转换：
const map = new Map(Object.entries(object));
console.log(map); // Map { "a" => 1, "b" => 2, "c" => 3 }生成的 map 对象中，每个键值对被作为 Map 对象的一对键值存储。
将对象转换为 URL 查询字符串
我们可以使用 Object.entries 方法将对象转换为 URL 查询字符串，将对象的每个属性名和属性值拼接成一个字符串，并使用 “&” 符号连接。我们可以使用 map 方法和 join 方法完成：
const params = { q: 'javascript', language: 'en' };
const queryString = Object.entries(params)
.map(([key, value]) => `${key}=${value}`)
.join('&');
console.log(queryString); // "q=javascript&language=en"上面的代码将对象 { q: 'javascript', language: 'en' } 转换为字符串 "q=javascript&language=en"。
遍历对象并转换属性名
有时我们需要遍历对象，并根据一些条件转换属性名。我们可以使用 Object.entries 方法遍历键值对数组，并使用 reduce 方法转换属性名：
const object = { fooBar: 1, barBaz: 2 };
const result = Object.entries(object).reduce((acc, [key, value]) => ({
...acc,
[key.replace(/([A-Z])/g, '_$1').toLowerCase()]: value,
}), {});
console.log(result); // { "foo_bar": 1, "bar_baz": 2 }上述代码将对象 { fooBar: 1, barBaz: 2 } 的属性名转换为小写字母，同时在大写字母前添加下划线。
总结
本文介绍了使用 Object.entries 方法的一些技巧，包括遍历键值对数组、将键值对数组转换为 Map 对象、将对象转换为 URL 查询字符串等。这些技巧可以帮助开发者更好地处理对象数据，提高代码的效率和可读性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6540582e7d4982a6eb9d12e5