在 Javascript 中访问（嵌套的）对象和数组

Question

我不确定我是否对如何组织数组或如何访问它有误解。

提议很简单：拥有一系列汽车品牌和型号并访问它们进行展示。

const carBrands = [

  {

    Audi: {

      models: ["A1", "A2", "A3", "A4"],

      unitsAvailable: 378,

    }

  },

  {

    BMW: {

      models: ["M1", "M2", "M3", "M4"],

      unitsAvailable: 413,

    },

  },

  {

    Honda: {

      models: ["H1", "H2", "H3", "H4"],

      unitsAvailable: 226,

    },

  }

];

我可以这样访问每个模型：

  carBrands.forEach((object, i) => {

    console.log(object, i)

  });

这会返回我的对象和索引：

奥迪 0 宝马 1 本田 2

我不知道的是如何返回：

品牌：奥迪型号：A1、A2、A3、A4 可用单位：378

...对于 3 辆车中的每一辆。

我知道我必须遍历数组并为每个循环返回对象键/值对。但是我在使用正确的语法时遇到了问题。这是我想弄清楚如何制定的内容：

  let modelsToDisplay = [];

  carBrands.forEach((object, i) => {

    modelsToDisplay.push(<li key={i}>Make/Model/Units of each object</li>);

  });

感谢您的帮助:)

Answer 1

carBrands.flatMap(Object.entries) &nbsp;&nbsp;&nbsp;&nbsp;.map(([key,&nbsp;{&nbsp;models,&nbsp;unitsAvailable&nbsp;}])&nbsp;=>&nbsp;`${key}&nbsp;${models.join(",&nbsp;")}&nbsp;${unitsAvailable}`) &nbsp;&nbsp;&nbsp;&nbsp;.forEach(v&nbsp;=>&nbsp;console.log(v))

Answer 2

因为您的数组由 dict 对象组成，所以您需要考虑到您需要迭代键。在不修改输入的情况下，您可以使用以下代码来处理数据结构的内部值：// For all defined objectscarBrands.forEach((object) => {&nbsp; // Determine manufacturers inside the current object (only 1 manufacturer per object in your case)&nbsp; var manufacturers = Object.keys(object);&nbsp; // For each manufacturer&nbsp; manufacturers.forEach((manufacturer) => {&nbsp; &nbsp; // Print manufacturer name&nbsp; &nbsp; console.log("Manufacturer: " + manufacturer);&nbsp; &nbsp; console.log("Models:");&nbsp; &nbsp; // For all models&nbsp; &nbsp; var models = object[manufacturer].models;&nbsp; &nbsp; models.forEach((model) => {&nbsp; &nbsp; &nbsp; // print model name&nbsp; &nbsp; &nbsp; console.log("&nbsp; " + model);&nbsp; &nbsp; });&nbsp; &nbsp; // print available units&nbsp; &nbsp; console.log("Available units:");&nbsp; &nbsp; console.log("&nbsp; " + object[manufacturer].unitsAvailable + "\n");&nbsp; });});输出：Manufacturer: AudiModels:&nbsp; A1&nbsp; A2&nbsp; A3&nbsp; A4Available units:&nbsp; 378Manufacturer: BMWModels:&nbsp; M1&nbsp; M2&nbsp; M3&nbsp; M4Available units:&nbsp; 413Manufacturer: HondaModels:&nbsp; H1&nbsp; H2&nbsp; H3&nbsp; H4Available units:&nbsp; 226

Answer 3

您遇到的问题是因为您使用的顶级密钥是唯一的。而不是命名您的键Audi，BMW等等。我会使用一个通用键make，并将其值设置为您的品牌。这样，当您执行循环时，您每次都可以请求相同的密钥：const carBrands = [&nbsp; {&nbsp; &nbsp; make: 'Audi',&nbsp; &nbsp; models: ["A1", "A2", "A3", "A4"],&nbsp; &nbsp; unitsAvailable: 378&nbsp; },&nbsp; {&nbsp; &nbsp; make: 'BMW',&nbsp; &nbsp; models: ["M1", "M2", "M3", "M4"],&nbsp; &nbsp; unitsAvailable: 413&nbsp; },];carBrands.forEach(brand => {&nbsp; &nbsp; console.log(brand.make);&nbsp; &nbsp; brand.models.forEach(model => console.log(model));});由于您谈到要维护对象中的关系，我鼓励您考虑如何将此信息存储在数据库中，并以此为基础组织您的组织。有很多carBrands。每个carBrand都有一个make, unitsAvailable, 并且有很多models.您不会为每个创建一个新表carBrand，对吗？您将添加一个新行。因此，按照上面的方式构建它更接近于将其保存在数据库中的方式，这有利于数据完整性并使其更加灵活。在这种结构中，通过 make 获取东西仍然很容易，例如：let audiModels = carBrands.filter(brand => brand.make == 'Audi').models;

Answer 4

这里的所有答案都是“正确的”，非常感谢你们！所以没有一个比另一个更好。我认为乔纳森对我过于复杂的数据结构提出了一个很好的观点。我将回到更简单的版本，其中“Audi”等将是一个值，而不是一个键。但我还将按照 Mottek 的建议构建当前结构和访问数据的示例。当我深入到项目中时，我将决定哪个是最终版本。感谢大家的大力帮助！