为何Object.keys()对对象字面量与Object.create()返回结果不同？

这确实是个容易踩坑的细节，本质是两种对象构建方式导致的属性归属不同，完全符合MDN对Object.keys()的定义——它只返回对象自身的可枚举属性，咱们一步步拆解：

先还原你的场景（应该是类似这样的代码） #

// 基础对象
const baseObj = { countryOfOrigin: 'China' };

// 1. 对象字面量写法：复制baseObj的属性并添加新属性
const literalObj = { ...baseObj, medium: 'paper' };

// 2. Object.create写法：以baseObj为原型创建新对象，再添加自身属性
const createObj = Object.create(baseObj);
createObj.medium = 'paper';

// 输出结果
console.log(Object.keys(literalObj)); // ['countryOfOrigin', 'medium']
console.log(Object.keys(createObj)); // ['medium']

核心差异在哪里？ #

• 对象字面量的属性都是「自身属性」：不管你是直接写在字面量里，还是用扩展运算符...从其他对象复制过来，这些属性都会被直接添加到新对象的自身空间里，属于它自己的可枚举属性，所以Object.keys()会把它们全部列出来。
• Object.create()创建的对象是「原型继承」：Object.create(baseObj)会生成一个空对象，这个对象的__proto__指向baseObj。之后你给createObj添加的medium是它的自身属性，但countryOfOrigin是存在于原型链（baseObj）上的，不属于createObj自己，所以Object.keys()只会返回它自身的medium。

额外补充 #

如果想遍历包括原型链在内的所有可枚举属性，可以用for...in循环，但记得配合hasOwnProperty()来区分自身属性和原型属性：

for (const key in createObj) {
  if (createObj.hasOwnProperty(key)) {
    console.log('自身属性:', key); // 输出 medium
  } else {
    console.log('原型属性:', key); // 输出 countryOfOrigin
  }
}

内容的提问来源于stack exchange，提问作者phnix