在前端开发中，处理对象是一个必不可少的操作。ES6 引入了 Object.keys 方法，返回某个对象自身属性名的数组。而在 ES7 中，Object 对象新增了 Object.values 和 Object.entries 方法，相比于 Object.keys，它们能更全面地展示一个对象的信息。下面就让我们来详细了解一下它们的使用技巧。
Object.values 方法
Object.values 方法返回一个由指定对象的所有可枚举属性值组成的数组，值的顺序与使用 for...in 循环的顺序相同，与 Object.keys 方法生成的数组顺序相同。
语法
Object.values(obj)
参数
obj：必选项，要返回其枚举自身属性的对象。
返回值
一个包含对象所有属性值的数组。
使用示例
let obj = { a: 1, b: 2, c: 3 };
let values = Object.values(obj);
console.log(values); // [1, 2, 3]Object.entries 方法
Object.entries 方法返回一个给定对象自身可枚举属性的键值对数组。这个数组的属性值形式为 [key, value]，即键名和对应的值。返回的数组成员顺序与使用 for...in 循环遍历对象时返回的顺序一致。
语法
Object.entries(obj)
参数
obj：必选项，要返回其枚举自身属性的对象。
返回值
一个包含对象所有属性键值对的数组。
使用示例
let obj = { a: 1, b: 2, c: 3 };
let entries = Object.entries(obj);
console.log(entries); // [["a", 1], ["b", 2], ["c", 3]]注意事项
- 只遍历对象自身的可枚举属性。
- 如果需要遍历对象继承的属性，需使用
for...in或Object.getOwnPropertyNames(obj)。
使用技巧
- Object.values 和 Object.entries 方法均可用于遍历对象的键值对，可以相互转换使用。
let obj = { a: 1, b: 2, c: 3 };
let entries = Object.entries(obj);
let values = Object.values(obj);
console.log(entries); // [["a", 1], ["b", 2], ["c", 3]]
console.log(values); // [1, 2, 3]- Object.values 和 Object.entries 方法可用于获取对象属性值匹配某个值的键名或键值对。
let obj = { a: 1, b: 2, c: 3 };
let key = Object.keys(obj).find(key => obj[key] === 2);
let value = Object.entries(obj).find(([key, value]) => value === 2);
console.log(key); // "b"
console.log(value); // ["b", 2]- Object.values 和 Object.entries 方法也可用于计算对象属性值之和、平均值、最大值、最小值等统计信息。
-- -------------------- ---- ------- --- --- - - -- -- -- -- -- - -- --- --- - -------------------------------- ---- -- ---- - ---- --- --- ------- - --- - -------------------------- --- --- - -------------------------------- --- --- - -------------------------------- ----------------- -- - --------------------- -- - ----------------- -- - ----------------- -- -
总结
Object.values 和 Object.entries 方法是处理对象的实用方法，它们可用于获取对象的所有属性值或键值对，也可用于获取匹配某个值的键名或键值对，以及进行对象属性值之和、平均值、最大值、最小值等统计信息的计算。在实际开发中，利用好这些方法将会提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a7c86748841e989445dcc4