在 JavaScript 中，对象是一种非常常用的数据类型，而 Object.values() 方法是 ES7 中新增的一个方法，它可以返回一个对象所有可枚举属性的值，这在前端开发中是非常有用的。本文将详细介绍 Object.values() 方法的使用及其实战场景。
Object.values() 方法的使用
Object.values() 方法可以接收一个对象作为参数，并返回一个由该对象所有可枚举属性的值所组成的数组。下面是一个简单的示例：
const obj = {a: 1, b: 2, c: 3};
const values = Object.values(obj);
console.log(values); // [1, 2, 3]该示例中，我们首先创建了一个包含三个属性的对象，然后使用 Object.values() 方法获取该对象的所有值，并将其存储在一个数组中。最后，我们将该数组打印出来，可以看到它包含了该对象所有属性的值。
需要注意的是，Object.values() 方法只返回对象的可枚举属性的值，而不包括其原型链上的属性。如果要获取对象的所有属性的值，可以使用 Object.getOwnPropertyNames() 方法。
Object.values() 方法的实战场景
Object.values() 方法的实战场景非常多，下面我们将介绍其中的一些。
1. 获取对象的值的总和
在前端开发中，经常需要对一组数据进行统计分析，而 Object.values() 方法可以非常方便地帮助我们获取对象的值的总和。下面是一个示例：
const obj = {a: 1, b: 2, c: 3};
const values = Object.values(obj);
const sum = values.reduce((acc, cur) => acc + cur, 0);
console.log(sum); // 6该示例中，我们首先创建了一个包含三个属性的对象，然后使用 Object.values() 方法获取该对象的所有值，并将其存储在一个数组中。最后，我们使用 reduce() 方法将该数组中的所有值累加起来，得到了对象的值的总和。
2. 获取对象的最大值和最小值
除了获取对象的值的总和外，Object.values() 方法还可以帮助我们获取对象的最大值和最小值。下面是一个示例：
const obj = {a: 1, b: 2, c: 3};
const values = Object.values(obj);
const max = Math.max(...values);
const min = Math.min(...values);
console.log(max, min); // 3 1该示例中，我们首先创建了一个包含三个属性的对象，然后使用 Object.values() 方法获取该对象的所有值，并将其存储在一个数组中。最后，我们使用 Math.max() 和 Math.min() 方法获取该数组中的最大值和最小值，从而得到了对象的最大值和最小值。
3. 对象属性的过滤和映射
在前端开发中，经常需要对一组数据进行过滤和映射，而 Object.values() 方法可以非常方便地帮助我们实现这些功能。下面是一个示例：
const obj = {a: 1, b: 2, c: 3};
const filteredValues = Object.values(obj).filter(value => value > 1);
const mappedValues = Object.values(obj).map(value => value * 2);
console.log(filteredValues, mappedValues); // [2, 3] [2, 4, 6]该示例中，我们首先创建了一个包含三个属性的对象，然后使用 Object.values() 方法获取该对象的所有值，并将其存储在一个数组中。接着，我们使用 filter() 方法过滤出该数组中大于 1 的值，并使用 map() 方法将该数组中的每个值都乘以 2。最后，我们将过滤后和映射后的数组打印出来，可以看到它们分别包含了过滤后和映射后的值。
总结
Object.values() 方法是 ES7 中新增的一个方法，它可以返回一个对象所有可枚举属性的值，这在前端开发中非常有用。本文介绍了 Object.values() 方法的使用及其实战场景，希望对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65f98a03d10417a222566ece