Question

我想要完成的事情：

检索所有licenseTypes（digger和shovler），以便我可以将它们插入标题div中。
检索相应的licenseTypes＆＃39; sublicenses将在子标题（或可能是正文）中使用，具体取决于视图。

我的数组看起来像这样：

const licenseType = [
    {
      diggerLisense: [
        "Shallow Digger",
        "Deep Digger"
      ]
    },
      shoverlerLicense: [
        "Poop shovler",
        "Grass shovler"
      ]
    }
 ]

基本上，我有这个结构：

licenseType＆gt; subLicenseType＆gt; subSubLicenseType

我特别决定了这个嵌套订单有三个原因：

映射licenseTypes（digger和shovler），以便可以在卡片标题中使用
映射相应的subLicenseTypes（Shallow Digger，Deep Digger，Poop shover，Grass shovler）以用于相同的卡片子标题。出于某种原因，我认为以这种方式处理状态更容易。
将所有许可证类型保存在整个项目中可以导出/导入的整洁对象结构中。

这里非常感谢任何帮助或指责。顺便说一句，我已经搜索了其他问题，并没有完全像我在这里描述的结构。

编辑：我要感谢你所提供的压倒性和迅速的回应。我很惊讶你们有多快帮助你们。这是我在这里的第一个问题，我无法相信答复的速度。

我目前正在处理提供的建议，包括建议采用不同格式的建议。我将在完成后发布最终结果的小提琴。感谢stackoverflow社区的所有成员

Answer 1

您可以使用Array.map()迭代licenseType。对于每个对象，获取第一个entry，并返回您想要显示的内容：

const licenseType = [{"diggerLisense":["Shallow Digger","Deep Digger"]},{"shoverlerLicense":["Poop shovler","Grass shovler"]}];
 
const result = licenseType.map((o) => {
  const [license, subLicenses] = Object.entries(o)[0];
  
  return `
    <h1>${license}</h1>
    <ul>
      ${subLicenses.map((s) => `<li>${s}</li>`).join('\n')}
    </ul>
  `;
});

demo.innerHTML = result.join('\n');

<div id="demo"></div>

但是，在对象中更改密钥会使其不必要地复杂化。我建议采用略有不同的格式：

{
    license: 'digger',
    sub: ['Shallow Digger', 'Deep Digger']
}

const licenseType = [{ "license": "digger", "sub": ["Shallow Digger","Deep Digger"]},{ "license": "shoverler", sub: ["Poop shovler","Grass shovler"]}];
 
const result = licenseType.map(({ license, sub }) => `
  <h1>${license}</h1>
  <ul>
    ${sub.map((s) => `<li>${s}</li>`).join('\n')}
  </ul>
`);

demo.innerHTML = result.join('\n');

<div id="demo"></div>

Answer 2

试试这个：

licenseType.forEach(element => {
    element[Object.keys(element)[0]].forEach(subTypes => {
         console.log(subTypes);
     })
});

Answer 3

根据您当前的数据集，您可以执行以下操作。

但是，如果您的顶级数据结构是一个对象而不是一个数组，那将会更容易。

const licenseType = [
    {
      diggerLisense: [
        "Shallow Digger",
        "Deep Digger"
      ]
    },
    {
      shoverlerLicense: [
        "Poop shovler",
        "Grass shovler"
      ]
    }
 ];

 const getLicenses = () => licenseType.map(license => Object.keys(license)[0]);

 const getData = (toFind) => licenseType.find(license => Object.keys(license)[0] === toFind);

 const getSubtypes = (license) => {
   const data = getData(license);
   if (data) {
     subTypes = data[license];
   }
   return subTypes;
 };
 
 console.log(getLicenses());
 console.log(getSubtypes('shoverlerLicense'));

Answer 4

LicenseType is an array So you can access the license type like licenseType[i] where it represents the element of the array. for sub license type use 

sublicensetype = [] 
for (i = 0; i < licenseType.length; i++) { 
    for ( var k in licenseType[i]) sublicenseType.push(k) 
}

Answer 5

尝试this fiddle：

licenseType.forEach(function (type) {
  console.log('type', type);
  Object.keys(type).forEach(function (typeKey) {
   console.log('typeKey',typeKey);
   console.log('typeValues',type[typeKey]);
  });    
});

此外，您的初始数组中存在语法错误：

const licenseType = [
  {
    diggerLisense: [
      "Shallow Digger",
      "Deep Digger"
    ]
  },
  { //this bracket was missing
    shoverlerLicense: [
      "Poop shovler",
      "Grass shovler"
    ]
  }
 ]

如何遍历嵌套在一个对象中的数组，该对象又嵌套在一个数组中？

5 个答案: