JavaScript深度嵌套数组过滤 [英] JavaScript Deeply Nested Array filtering

问题描述

我创建了某种方式的功能深度嵌套数组过滤功能。此功能显示汽车，为其分配了颜色红色。但是，通过过滤器的汽车是仅分配了1种颜色的汽车。
如何确保条件检查阵列中的阵列？我需要在循环内创建循环吗？理想的结果是，如果将标准设置为红色，由于这些汽车也具有此颜色，因此还将显示BMW和SUZUKI。

任何帮助，建议或与其他帖子的其他链接，以实现期望的结果，将不胜感激，因为我自己找不到任何有用的东西。该帖子最有用的就是该帖子-在JS中用深度嵌套的数组过滤数组

下面，我附加了当前代码的代码段。

  const myCars = [{名称： BMW，颜色：[ White， Red， Black]}}，{名称： AUDI，颜色：[黄色，银色]}，{名称： VW，颜色：[ Purple， Gold]}，{名称： NISSAN，颜色：[ White，  [Black]]}，{名称： SUZUKI，颜色：[ Red]}，];用于（x in myCars）{var keys = Object.keys（myCars [x]）var carSpec = myCars.filter（ function（fltr）{return（fltr.colour == Red）;}）; document.getElementById（ show1）。innerHTML + = carSpec [x] .name + +具有这些颜色- + carSpec [x] .colour +< hr />;}  

 < p>汽车清单。< / p>< p id = show>< / p>< p id = show1>< / p>  

p>

解决方案

您需要过滤器通过 includes 在 colour 数组上进行测试：

  const myCars = [{名称： BMW，颜色：[ White， Red， Black]}}，{名称： AUDI，颜色：[ Yellow ， Silver]}，{名称： VW，颜色：[ Purple， Gold]}，{名称： NISSAN，颜色：[ White， Black]}，{名称： SUZUKI，颜色：[ Red]}，]; const show1 = document.getElementById（ show1）; myCars .filter（（{{color} ）=> colour.includes（'Red'））.forEach（（{{name，color}）=> {show1.innerHTML + = name + +具有这些颜色- + color +< hr /> ;}）;  

 < p>汽车清单。 ; / p>< p id = show>< / p>< p id = show1>< / p>  

I have created a somehow functional "deeply" nested array filtering functionality. This functionality displays car, which has a color "RED" assigned to them. However the cars, which "pass" the filter is the car, which only has 1 color assigned.
How can ensure that arrays within arrays are being checked by the criteria? Would I require creating a loop within loop? The desired outcome would be that if criteria is set to "RED" it will also display the BMW and SUZUKI as these cars also have this color.

Any help, suggestions or further links to other posts to achieve the desired outcome would be truly appreciated as I was not able to find anything very useful on my own. The post, which has been most useful has been this one - Filtering an array with a deeply nested array in JS

Below I have attached the code snippet of my current code.

const myCars = [
    { name: "BMW",colour: ["White","Red","Black"] },
    { name: "AUDI",colour: ["Yellow","Silver"] },
    { name: "VW",colour: ["Purple","Gold"] },
    { name: "NISSAN",colour: ["White","Black"] },
    { name: "SUZUKI",colour: ["Red"] }, 
];

for (x in myCars) {
  var keys = Object.keys(myCars[x])

  var carSpec = myCars.filter(function(fltr) {
    return (fltr.colour == "Red");

  });
  document.getElementById("show1").innerHTML += carSpec[x].name + " " + "has these colours - " + carSpec[x].colour + "<hr />";
}

<p>Car List.</p>

<p id="show"></p>
<p id="show1"></p>

解决方案

You need to filter by an includes test over the colour array:

const myCars = [
    { name: "BMW",colour: ["White","Red","Black"] },
    { name: "AUDI",colour: ["Yellow","Silver"] },
    { name: "VW",colour: ["Purple","Gold"] },
    { name: "NISSAN",colour: ["White","Black"] },
    { name: "SUZUKI",colour: ["Red"] }, 
];
const show1 = document.getElementById("show1");
myCars
  .filter(({ colour }) => colour.includes('Red'))
  .forEach(({ name, colour }) => {
    show1.innerHTML += name + " " + "has these colours - " + colour + "<hr />";
  });

<p>Car List.</p>

<p id="show"></p>
<p id="show1"></p>

这篇关于JavaScript深度嵌套数组过滤的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！