本文共 1565 字，大约阅读时间需要 5 分钟。

Object.keys() 和 Object.getOwnPropertyNames() 的区别

在 JavaScript 中，Object.keys() 和 Object.getOwnPropertyNames() 是两个常用的方法，用于获取对象的属性。不过，它们在行为上有一些细微的差异，理解这些差异对于更好地使用 JavaScript 是非常重要的。

**共同点**：

无论是使用 Object.keys() 还是 Object.getOwnPropertyNames()，都主要用于获取对象的属性名称，并且都不会返回原型链上的属性。这意味着它们都能返回当前对象的自身属性，不会包括从父对象或其他上下文中继承的属性。

**区别**：

Object.keys() 的主要作用是返回一个对象的可枚举属性名称。具体来说，它只会返回那些可以通过对象的 ownProperty（自身属性）遍历到，并且属性的值不为 undefined 的属性。换句话说，Object.keys() 只会返回可枚举的属性。

而 Object.getOwnPropertyNames() 的作用则更广泛一些。它会返回所有对象的自身属性的名字，包括那些不可枚举的属性（尽管不可枚举属性通常不会被默认遍历到）。需要注意的是，Object.getOwnPropertyNames() 仍然不会返回 Symbol 值作为属性名的属性。

举个例子来更直观地理解两者的区别：

const obj = { property1: 1, property2: 2 };
console.log(Object.keys(obj)); // 输出: ["property1", "property2"]
console.log(Object.getOwnPropertyNames(obj)); // 输出: ["property1", "property2"]

在这个例子中，Object.keys() 和 Object.getOwnPropertyNames() 的输出看起来是一样的。但如果我们考虑一些特定的情况，两者的区别就会显现出来。

考虑一个带有不可枚举属性的对象：

const Person = function(name) {
  this.name = name || '';
};
Person.prototype.sayHello = function() {
  console.log('hello');
};
const p = new Person('yangyang');
p.age = 18;
Object.defineProperties(p, {
  age: {
    enumerable: false,
  }
});
console.log(Object.keys(p)); // 输出: ["name"]
console.log(Object.getOwnPropertyNames(p)); // 输出: ["name", "age"]

在这个例子中，Object.keys(p) 只返回了 "name"，因为它只返回可枚举的属性。而 Object.getOwnPropertyNames(p) 不仅返回了 "name"，还返回了 "age"，尽管 "age" 是不可枚举的属性。这正是两者区别所在。

总结一下：

如果你只需要获取对象的可枚举属性名称，Object.keys() 是更合适的选择。而如果你需要获取所有的自身属性名称（包括不可枚举的属性），则应该使用 Object.getOwnPropertyNames()。

在实际开发中，了解这些细节可以帮助你更好地控制对象的属性，优化代码的行为，并避免一些潜在的bug。