Javascript Object.keys() Object.values() 用法详解

Object.keys()

定义：
Object.keys() 是一个JavaScript内置函数，用于返回一个由对象自身的（不包括原型链上的）所有可枚举属性组成的数组。数组中属性名的排列顺序与通过手动循环对象属性时的顺序一致。

使用场景：

1. 当需要遍历对象的可枚举属性时，可以使用 Object.keys() 获取属性名数组，然后进行遍历。
2. 在处理对象时，如果需要获取对象的所有键（属性名），可以使用 Object.keys()。
3. 在需要判断对象是否包含某个属性时，可以先使用 Object.keys() 获取属性名数组，然后检查数组中是否包含该属性名。

用法详解：

// 示例对象
const person = {
  name: "张三",
  age: 25,
  sex: "男",
  getName: function() {}
};

// 使用 Object.keys() 获取对象的所有可枚举属性名
const keys = Object.keys(person);
console.log(keys); // 输出: ["name", "age", "sex", "getName"]

// 遍历对象的所有可枚举属性
keys.forEach(key => {
  console.log(`${key}: ${person[key]}`);
});

对于数组和字符串，Object.keys() 会返回其索引值组成的数组。

// 示例数组
const arr = [1, 2, 3, 4, 5];
console.log(Object.keys(arr)); // 输出: ["0", "1", "2", "3", "4"]

// 示例字符串
const str = "javascript";
console.log(Object.keys(str)); // 输出: ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"]

Object.values()

定义：
Object.values() 方法返回一个给定对象自身的所有可枚举属性值的数组，值的顺序与使用 for…in 循环的顺序相同（区别在于 for-in 循环枚举原型链中的属性，而 Object.values() 不包括原型链上的属性）。

使用场景：

1. 当需要获取对象的所有值时，可以使用 Object.values()。
2. 在处理对象时，如果需要遍历对象的所有值，可以先使用 Object.values() 获取值数组，然后进行遍历。
3. 在需要将对象的值转换为数组进行进一步处理时，可以使用 Object.values()。

用法详解：

// 示例对象
const obj = {
  passport: '护照',
  mobile: '手机号',
  phone: '固定电话',
  email: '电子邮箱'
};

// 使用 Object.values() 获取对象的所有可枚举属性值
const values = Object.values(obj);
console.log(values); // 输出: ["护照", "手机号", "固定电话", "电子邮箱"]

// 遍历对象的所有可枚举属性值
values.forEach(value => {
  console.log(value);
});

对于数组，Object.values() 会返回其顺序成员组成的数组。

// 示例数组
const arr = ['x', 'y', 'z'];
console.log(Object.values(arr)); // 输出: ["x", "y", "z"]

总结

• Object.keys() 用于获取对象的所有可枚举属性名组成的数组。
• Object.values() 用于获取对象的所有可枚举属性值组成的数组。
• 两者都不包括原型链上的属性。
• 在处理对象、数组和字符串时，这两个方法都非常有用。