javascript - 如何在 for...in 中获取嵌套对象属性的正确属性？

Question

给出以下代码片段:

let PARENT = {
  CHILD_1: {
    no: '1',
    page: 3,
    toString: function(){ return this.no; } },
  CHILD_2: {
    no: '2',
    page: 4,
    toString: function(){ return this.no; } },
}
console.log( JSON.stringify(PARENT, null, 1) )

for ( let c in PARENT ) {
  // c is a CHILD_n object here, right?

  console.log(c)  // why 'CHILD_n' instead of 'no' from toString()?
  console.log(c.page)  // why undefined instead of 'page'?
}

我没有得到预期的结果:

1. 为什么 c 解析为 CHILD_n 属性的名称而不是 toString() 返回的值？
2. 为什么c.page未定义？ 1. c 不是一个具有可用属性的 CHILD_n 对象吗？
3. 如何获得期望值？

Answer 1

正如评论中提到的，for...in 循环遍历按键；即字符串 'CHILD_1' 和 'CHILD_2' 而不是对象。

for... of 迭代值，但是，您不能直接迭代对象，因为对象是不可迭代的。 for (value of {}) {} 将引发错误。

相反，您必须通过例如获取可迭代的值列表在使用 for... of 进行迭代之前 Object.values。

最后，toString 不会由 console.log 自动调用，因此您必须显式调用它。

let PARENT = {
  CHILD_1: {
    no: '1',
    page: 3,
    toString: function(){ return this.no; } },
  CHILD_2: {
    no: '2',
    page: 4,
    toString: function(){ return this.no; } },
};

for ( let c of Object.values(PARENT) ) {
  console.log(c);
  console.log(c.toString());
  console.log(c.page);
}