为什么Object.getOwnPropertyNames(document)只输出一个['location']？

Question

控制台输入

Object.getOwnPropertyNames(document)
// ["location"]

Object.getOwnPropertyNames(document.__proto__)
// ["constructor"]

为什么只有一个属性被输出了

Answer 1

你这是啥浏览器……

（最后那个 jQuery 可以忽略，显然是思否打包的时候把 jQuery 挂到 document 上了）

Answer 2

你应该多往下试一试，Object.getOwnPropertyNames只会获取到对象自身的属性，不会获取到原型上的
document原型关系：HTMLDocument -> Document -> Node -> EventTarget -> Object

const fn = proto => {
    if (!proto) return []
    let arr = Object.getOwnPropertyNames(proto).map((name)=>({name, proto:proto.constructor.name}))
    return arr.concat(fn(proto.__proto__))
}

const properties = fn(document); // 获取原型链上所有可枚举属性

properties.find(p => p.name==="URL")
// {name: "URL", proto: "Document"}
// URL是Document原型上的属性

properties.find(p => p.name==="baseURI")
// {name: "baseURI", proto: "Node"}
// baseURI是Node原型上的属性