object.values()的用法

发布时间:2023-05-24

一、用法介绍

在ES2017 (ECMA8)中,引入了新的方法Object.values(),该方法可以将一个对象的所有属性的值以数组的形式返回。这个方法非常方便,因为在JavaScript中访问对象的属性时,我们通常是需要遍历对象所有的属性,并单独取出值这就需要我们写循环遍历的代码,非常繁琐。而使用Object.values()则可以避免这种不必要的麻烦。

const object1 = { a: 'value1', b: 'value2', c: 'value3' };
console.log(Object.values(object1)); // ['value1', 'value2', 'value3']

二、使用场景

Object.values()方法的最常见用途就是获取对象的值,它方便、快捷,可以用来迭代和过滤对象的值。

1、迭代对象的属性值

在很多情况下,我们需要迭代对象的属性值,比如说打印一个对象的所有值,或者检查对象的所有值是否符合某个条件。在这种情况下,使用 Object.values() 函数可以让代码显得更直观方便。

const person = {
  name: 'Jack',
  age: 25,
  job: 'programmer',
  address: {
    city: 'Shanghai',
    street: 'Nanjing Road'
  }
};
Object.values(person).forEach(value => console.log(value));
// prints "Jack", 25, "programmer", {city: "Shanghai", street: "Nanjing Road"}

上面这个例子中,我们使用Object.values()forEach() 迭代了person对象所有值。

2、获取对象的属性值并过滤

在某些情况下,我们可能需要筛选对象值数组上符合某些条件的值。事先,我们可以使用 Array.filter() 方法过滤数据的值数组:

const person = {
  name: 'Jack',
  age: 25,
  job: 'programmer',
  address: {
    city: 'Shanghai',
    street: 'Nanjing Road'
  }
};
const jobIsProgrammer = value => value === 'programmer';
const programmerValues = Object.values(person).filter(jobIsProgrammer);
console.log(programmerValues); // ["programmer"]

在这个例子中,我们使用Object.values()来获取person对象的每一个属性的值,之后再通过 Array.filter() 方法筛选出了符合判断条件的值:占据职业为程序员的值。

三、结合其他方法的用法

Object.values() 方法可以和同样方便快捷的方法Object.keys()结合使用,一起来获取对象中属性的值和对应的键。

const object1 = { a: 'value1', b: 'value2', c: 'value3' };
const keys = Object.keys(object1);
const values = Object.values(object1);
const entries = Object.entries(object1);
console.log(keys); // ['a', 'b', 'c']
console.log(values); // ['value1', 'value2', 'value3']
console.log(entries); // [['a', 'value1'], ['b', 'value2'], ['c', 'value3']]

在这个例子中,我们将对象object1通过Object.keys()Object.values()以及Object.entries()分别转化为键数组、值数组以及[键,值]对数组。这实际上是一种比较常见的操作,可以在Ajax请求中对多次读取对象的值。

四、使用Object.values()迭代对象时,请记得使用for-of循环

虽然我们在上面的很多例子中都使用了forEach()循环,但是实际上使用for-of循环更为安全:因为在迭代对象时,我们不能保证每个对象都支持 forEach() 这个方法,而使用ES6新增的for-of循环可以保证使用的是合法的迭代方法。在代码中使用for-of来迭代对象,可以保证代码的兼容性和稳定性。

var obj = {a: 1, b: 2, c: 3 };
// for...of循环读取对象的值
for(var val of Object.values(obj)){
  console.log(val);
} // 1 2 3

五、总结

Object.values()方法是一个非常实用的方法,极大地简化了访问对象的属性值的过程,并且兼容性较好。我们可以使用它来迭代对象的属性值,或者过滤对象的值数组,并且可以结合Object.keys()方法来同时获取对象的属性和属性值。