关于Object.keys()，Object.getOwnPropertyNames()和for in循环

1、Object.keys()：

• Object.keys()返回一个由给定对象自身可枚举的字符串键属性键组成的数组。
• 故：
  • 它只返回对象自身的可枚举属性，不包括继承的属性。
  • 返回的属性数组的顺序与对象中属性的插入顺序一致。

const obj = { a: 1, b: 2, c: 3 };
const keys = Object.keys(obj);
console.log(keys); //  ["a", "b", "c"]

2、Object.getOwnPropertyNames()：

• 和 Object.keys()不同的是：
• Object.getOwnPropertyNames()返回一个由给定对象自身所有自有属性组成的数组，无论属性是否可枚举。
• 故：
  • 它返回的属性数组包括对象自身的可枚举和不可枚举属性，但不包括继承的属性。
  • 返回的属性数组的顺序与对象中属性的插入顺序一致。

const obj = { a: 1, b: 2, c: 3 }; 
const properties = Object.getOwnPropertyNames(obj); 
console.log(properties); //  ["a", "b", "c"]

3、两者区别：

const person = { name: 'Fengfeng', age: 18, }; 
Object.defineProperty(person, 'gender', {
    value: 'male',
    enumerable: false, 
});
console.log(Object.keys(person)); // ["name", "age"] 
console.log(Object.getOwnPropertyNames(person)); // ["name", "age", "gender"]

这里用Object.defineProperty定义一个不可枚举的属性gender，Object.keys方法就遍历不到了。

4、 for...in循环:

• for...in用于遍历对象的可枚举属性（包括自身属性和继承属性）。

  const obj = { a: 1, b: 2, c: 3 };
  for (let key in obj) {
      console.log(key); // "a", "b", "c"
  }

• 注意，for...in循环还会遍历出对象的原型链上的属性，因此在使用for...in循环时，通常需要使用hasOwnProperty()方法来检查属性是否为对象自身的属性。
• 不建议用for...in遍历数组：
  • 遍历的的属性值是字符串，而不是数字
  • 遍历的是数组的可枚举属性，包括自身属性以及原型链上的属性
  • 遍历顺序有可能不是按照实际数组的内部顺序

5、总结：

如果只想要对象自身的可枚举属性，可以使用Object.keys()方法。如果需要对象自身的所有属性，包括不可枚举属性和可枚举属性，可以使用Object.getOwnPropertyNames()方法。而for...in循环则可以用于遍历对象自身和继承的可枚举属性。

另外这三种都不会遍历到Symbol定义的属性。