javascript - 显示 javascript 原型(prototype)链

Question

我想查看原型(prototype)链中的项目列表有办法知道吗？我尝试使用 getOwnPropertyNames，但它不显示原型(prototype)链

function Grid(width, height) {
  this.width = width;
  this.height = height;
}
Grid.prototype.example = function() {console.log("hello");}

console.log(Object.getOwnPropertyNames(new Grid()));
//["width", "length"]

为什么不显示，有什么方法可以显示吗？

当属性从另一个构造函数继承时，当我使用 getOwnPropertyNames 时，我也有一个奇怪的错误

function Grid(width, height) {
  this.space = new Array(width * height);
  this.width = width;
  this.height = height;
}

console.log(Object.getOwnPropertyNames(new Grid()));
//it gives me these errors
Uncaught RangeError: Invalid array length
at new Grid (<anonymous>:3:20)
at <anonymous>:2:40
at Object.InjectedScript._evaluateOn (<anonymous>:905:140)
at Object.InjectedScript._evaluateAndWrap (<anonymous>:838:34)
at Object.InjectedScript.evaluate (<anonymous>:694:21)

这是为什么？

Answer 1

我想最简单的方法是使用 for 循环:

for (var prop in obj) {
  console.log(prop);
}

如果您想获取所有属性，而不仅仅是可枚举的属性，您可以结合使用Object.getOwnPropertyNames 和Object.getPrototypeOf。 :

function getPropertyNames(obj) {
  return obj ? 
    Object.getOwnPropertyNames(obj)
      .concat(getPropertyNames(Object.getPrototypeOf(obj))) :
    [];
}

注意:此列表可以包含重复项。