在前端开发中，我们经常需要获取对象属性值，ECMAScript 2019 中引入了 Object.keys 和 Object.values 方法，可以极大地方便我们获取对象属性值。
Object.keys 方法
Object.keys 方法是用来获取对象的所有属性名的数组，返回值是由所有枚举属性的属性名（键）组成的字符串数组。
const obj = {
name: 'Alice',
age: 18,
job: 'frontend developer'
};
const keys = Object.keys(obj);
console.log(keys); // ['name', 'age', 'job']Object.keys 方法返回的数组中的元素顺序并不一定按照对象属性添加的顺序，而是按照数字升序排列。
我们可以使用 for...of 循环遍历该数组并进行属性获取操作。
for(const key of keys){
const value = obj[key];
console.log(`${key}: ${value}`);
}Object.values 方法
Object.values 方法是用来获取对象的所有属性值的数组，返回值是由所有枚举属性的属性值组成的数组。
const obj = {
name: 'Alice',
age: 18,
job: 'frontend developer'
};
const values = Object.values(obj);
console.log(values); // ['Alice', 18, 'frontend developer']Object.values 方法的执行结果，与 Object.keys 方法返回的数组中的元素顺序一一对应，在获取键值对时更为方便。
-- -------------------- ---- ------- ----- --- - - ----- -------- ---- --- ---- --------- ---------- -- --------- ----- -- -------------------- ------------------- -
示例代码
-- -------------------- ---- ------- ----- --- - - ----- -------- ---- --- ---- --------- ---------- -- -- ---------- ----- ---- - ----------------- ------------------ -- -------- ------ ------ -- ------------- --------- --- -- ------ ----- ----- - --------- -------------------- ----------- - -- ---------- ----- ------ - ------------------- -------------------- -- --------- --- --------- ----------- -- ------- --------- ----- -- -------- ------------------- -
总结
通过 Object.keys 和 Object.values 方法，我们可以实现快速获取对象属性值的操作，为我们的编程带来更加方便的体验。不仅如此，在日常开发中，熟练掌握这两个方法，也可以为我们提高编程效率，降低出错率，具有指导意义。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/651b4bbf95b1f8cacd2fbb7d