在前端开发中，经常需要遍历对象的值进行操作或计算。传统的方法是使用 for...in 循环遍历对象的属性，然后在循环中获取属性的值。但是这种方法有一些问题，比如 for...in 循环不仅会遍历对象自身的属性，也会遍历原型链上的属性；同时，for...in 循环也会遍历那些可枚举的、但是不一定是属性的键。ES7 引入了 Object.values() 方法来解决这些问题。
Object.values() 方法的介绍
Object.values() 方法返回一个包含对象的所有值的数组。对于对象的值的遍历是按对象的属性插入顺序进行的。如果对象的属性是 Symbol 类型，则 Object.values() 方法会忽略该属性。
Object.values() 方法的语法如下：
Object.values(obj)
其中，obj 是要获取值的对象。
Object.values() 方法的使用
使用 Object.values() 方法可以轻松地遍历对象的值。下面是一个示例：
const obj = { a: 1, b: 2, c: 3 };
const values = Object.values(obj);
console.log(values); // [1, 2, 3]在上面的示例中，我们首先创建了一个包含三个属性的对象 obj，然后使用 Object.values() 方法获取了 obj 的所有值，最后将这些值存储在 values 数组中。在第二行中，我们打印 values 数组，可以看到输出结果是 [1, 2, 3]，即 obj 的值的数组。
Object.values() 方法的深入应用
除了简单的对象值遍历外，Object.values() 方法还可以用于更复杂的应用场景。下面是一些示例。
对象值求和
可以使用 reduce() 方法将对象的值求和。下面是一个示例：
const obj = { a: 1, b: 2, c: 3 };
const sum = Object.values(obj).reduce((acc, cur) => acc + cur, 0);
console.log(sum); // 6在上面的示例中，我们先使用 Object.values() 方法获取 obj 的所有值，然后使用 reduce() 方法将这些值求和。reduce() 方法的第一个参数是一个累加器函数，它接收两个参数：acc 和 cur。acc 是当前的累加值，cur 是下一个值。在累加器函数中，我们将 acc 和 cur 相加并返回结果，最后求和结果存储在 sum 中。
对象值过滤
如果我们想要从对象的值中过滤出符合条件的值，可以使用 filter() 方法。下面是一个示例：
const obj = { a: 1, b: 2, c: 3 };
const filtered = Object.values(obj).filter(value => value % 2 === 0);
console.log(filtered); // [2]在上面的示例中，我们先使用 Object.values() 方法获取 obj 的所有值，然后使用 filter() 方法过滤出满足条件的值。filter() 方法的参数是一个回调函数，该函数接收一个参数 value，代表当前值。在回调函数中，我们使用 % 运算符来判断当前值是否满足条件，满足条件的值存储在 filtered 数组中。
结论
使用 Object.values() 方法可以快速遍历对象的值，并且不需要担心属性的遍历顺序或继承属性的问题。除此之外，Object.values() 方法还可以用于更复杂的应用场景，例如对对象值求和或者过滤对象值。Object.values() 方法在现代 JavaScript 中已经成为一个标准，可以帮助开发者编写更加可读且可维护的代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/671ce1099babaf620fb34a11