JavaScript通过值对数组进行排序并显示在HTML表中

Question

因此，我有此列表，我需要按照特定品牌的汽车对其进行排序。 例如，奥迪。 并将其显示在HTML表格中，一列包含名称，另一列包含拥有的车辆，第一个是奥迪车主，然后是其他人。 我怎样才能做到这一点？

const people = [
  { name: "Ana", cars: "Audi" },
  { name: "Victoria", cars: ["Audi", "BMW"] },
  { name: "Grace", cars: ["Volkwagen", "Audi"] },
  { name: "Dan", cars: ["Opel", "Volkswagen"] },
  { name: "Josh", cars: ["Opel"] },
  { name: "John", cars: ["BMW", "Jaguar"] },
  { name: "Damon", cars: ["Renault", "Mercedes", "Audi"] },
];

谢谢！

Answer 1

使用reduce()可以将车主分组。

 const people = [ { name: "Ana", cars: ["Audi"] }, { name: "Victoria", cars: ["Audi", "BMW"] }, { name: "Grace", cars: ["Volkswagen", "Audi"] }, { name: "Dan", cars: ["Opel", "Volkswagen"] }, { name: "Josh", cars: ["Opel"] }, { name: "John", cars: ["BMW", "Jaguar"] }, { name: "Damon", cars: ["Renault", "Mercedes", "Audi"] } ]; var brands = people.reduce((acc, o) => { o.cars.forEach(c => { if (!(c in acc)) acc[c] = []; acc[c].push(o.name); }); return acc; }, {}); var cont = document.getElementById("brands"); for (let b in brands) { var brand = document.createElement("p"); brand.innerHTML = "<b>" + b + "</b>: " + brands[b].join(" "); cont.appendChild(brand); } //console.log(brands); 

 <p>Brands and owners</p> <div id="brands"> </div>