遍历 Typescript 中的每个对象答案

【问题标题】：Iterate through each object in Typescript遍历 Typescript 中的每个对象
【发布时间】：2020-05-23 19:11:43
【问题描述】：

我有这个对象：

product: {
    id: "id1",
    title: "ProductName 1",
    additionalDetails: {
        o1: {
            id: "pp1", 
            label: "Text",
            content: [{ id: "ppp1", label: "Tetetet" }]
        },
        o2: {
            id: "pp2", 
            label: "Text2", 
            content: [{ id: "ppp2", label: "Tetetet2" }]
        } 
    }
}

我尝试迭代到每个 object.additionalDetails.object 但我不能。我的代码：

Object.keys(product.additionalDetails).forEach((key: string) => {
  const additionalDetail = product[key];
  const idLabel: string = additionalDetail.id;
  const label: string = additionalDetail.label;
  const contentId: string = additionalDetail.content[0].id;
  const content = additionalDetail.content[1].label;
});

但它不起作用。我错过了什么？

【问题讨论】：

additionalDetail.content 是一个数组，您正在尝试访问其id 属性（additionalDetail.content.id），因为它似乎总是只有一个元素，您可以使用additionalDetail.content[0].id跨度>
这看起来不像是正确的语法。您是否缺少 {} 将 o1 和 o2 包装在 product 中？
嗨 Catherine：您的第一个代码 sn-p 在语法上不是有效的 TypeScript。你确定你复制的正确吗？
其次：“它不起作用”对于那些试图帮助你的人来说通常不是很有帮助。请准确描述到底发生了什么，包括完整的错误消息等。
那是因为你需要使用product.additionalDetails[key] 而不仅仅是product[key]。

标签： javascript arrays typescript object foreach

【解决方案1】：

两个错误：

将product[key] 替换为product.additionalDetails[key]

和

additionalDetail.content[1] 不存在（content 是一个数组，里面只有一个元素）

product= {
  id: "id1",
  title: "ProductName 1",
  additionalDetails: {
    o1: {
      id: "pp1",
      label: "Text",
      content: [{
        id: "ppp1",
        label: "Tetetet"
      }]
    },
    o2: {
      id: "pp2",
      label: "Text2",
      content: [{
        id: "ppp2",
        label: "Tetetet2"
      }]
    }
  }
}

Object.keys(product.additionalDetails).forEach( key => {
  const additionalDetail = product.additionalDetails[key]; // <-- Here
  const idLabel = additionalDetail.id;
  const label= additionalDetail.label;
  const contentId = additionalDetail.content[0].id;
  // const content = additionalDetail.content[1].label;  // <-- content[1] Doesn't exist
});

【讨论】：

我应该写： const contentId = additionalDetail.content[0].id; AND const content = (additionalDetail.content) ？ AdditionalDetail.content[0].label：未定义；对吗？
是，或const content = additionalDetail.content[1] && additionalDetail.content[1].label，它会检查additionalDetail.content[1] 的存在，如果存在，请使用.label

【解决方案2】：

使用Object.keys、Object.values 或Object.entries 中的任何一个来遍历additionalDetails 的属性。

const product = {
  id: "id1",
  title: "ProductName 1",
  additionalDetails: {
    o1: {
      id: "pp1",
      label: "Text",
      content: [{
        id: "ppp1",
        label: "Tetetet"
      }]
    },
    o2: {
      id: "pp2",
      label: "Text2",
      content: [{
        id: "ppp2",
        label: "Tetetet2"
      }]
    }
  }
}

for (const [k, v] of Object.entries(product.additionalDetails)) {
  console.log(`Detail ${k} has label ${v.label}`);
}

【讨论】：

【解决方案3】：

您正在尝试获取数组的 id 索引

o1: {id: "pp1", label: "Text", content: [{id: "ppp1", label: "Tetetet"}]},

const contentId: string = additionalDetail.content.id;

您需要选择数组的索引以获取包含内容 id 的对象：

const contentId: string = additionalDetail.content[0].id;

您还应该使用 const 初始化 AdditionalDetails。

【讨论】：

我改了，还是不行。你是对的，但 smt else 也是一个问题。我更新了我的帖子。
您需要使用 0 作为索引，因为数组中只有一项。它从 0 开始