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>