在 Chrome 开发者工具中，对象前缀为 "constructor" 是什么意思？

Question

我正在使用 ExtJs，我想获取我所有 Stores（应用程序的状态）的快照，所以我想我会走根 Stores 并收集每个 data 属性（前提是该值本身不是 ExtJs Store）。

如果我检查开发人员控制台，我可以看到我想要的普通旧对象没有前缀 constructor，而是 Stores（类 ExtJs用于处理状态）以 constructor.

为前缀

我最初认为以 constructor 为前缀与对象实例化的方式有关，但我无法用以下任何方式重现 constructor 前缀。

> (function() {return {}})()
< {}

> class test {}
< undefined
> new test()
< test {}

> class test2 extends test{}
< undefined
> new test2()
> test2 {}

> new (function() {})
< {}

> function test3() {}
< undefined
> new test3()
< test3 {}

> Object.fromEntries(Array(20).fill(0).map((_, i) => [`${i}_someproperty`, "yeet"]))
< {0_someproperty: "yeet", 1_someproperty: "yeet", 2_someproperty: "yeet", 3_someproperty: "yeet", 4_someproperty: "yeet", …}

> {}
< {}

> (function(){return {}})()
< {}

这是什么意思，或者我如何检查 Chrome 开发者控制台是否为对象赋予了 constructor 前缀？

Answer 1

我不熟悉 ExtJS，但在我看来这很可能是使用恰好总是命名为 constructor 的函数创建某种通用子类的结果，例如

function makeExtension(original) {
  // old-style prototype/constructor extension
  function constructor() {
    original.apply(...arguments);
  }
  constructor.prototype = Object.create(original.prototype);
  return constructor;
}

// old-style constructor
function Foo() {}
Foo.prototype.m = function() { console.log("hello world"); };

let Bar = makeExtension(Foo);

鉴于此，对象显示在 console/inspector 中，其类型位置为“构造函数”：

> new Bar()
< ▸ constructor {}

在 Chrome 开发者工具中，对象前缀为 "constructor" 是什么意思？

In Chrome Developer Tools, what does it mean when an object is prefixed with "constructor"?

google-chrome

extjs

google-chrome-devtools