如何根据另一个对象数组中的元素对对象数组进行排序？

Question

设per & con为对象的 arrays。 我想按照con数组continent的升序对per数组进行排序。 该怎么办？ 只使用排序和查找功能。 这是我的代码：

 function checkContinent(pe, co) { const cc = pe.sort(function(a) { let fa = co.find(function(b) { return b.city === a.city; }); fa.sort(sortContAsc); return fa; }); return cc; } function sortContAsc(s1, s2) { return s1.continent.localeCompare(s2.continent); } const per = [{ name: "Mary", city: "London" }, { name: "Anita", city: "Paris" }, { name: "Edward", city: "New York" }, { name: "Thomas", city: "Rome" }, { name: "Robin", city: "Seattle" }, { name: "Sophia", city: "Los Angeles" }, { name: "Bruce", city: "Delhi" } ]; const con = [{ city: "London", continent: "Europe" }, { city: "Delhi", continent: "Asia" }, { city: "Seattle", continent: "North America" }, { city: "Paris", continent: "Europe" }, { city: "New York", continent: "North America" }, { city: "Rome", continent: "Europe" }, { city: "Bengaluru", continent: "Asia" }, { city: "Los Angeles", continent: "North America" } ]; const cs = con.sort(sortContAsc); console.log(checkContinent(per, cs));

Answer 1

您可以将 object 用于各大洲，然后通过获取城市的洲来进行排序。

 const per = [{ name: "Mary", city: "London" }, { name: "Anita", city: "Paris" }, { name: "Edward", city: "New York" }, { name: "Thomas", city: "Rome" }, { name: "Robin", city: "Seattle" }, { name: "Sophia", city: "Los Angeles" }, { name: "Bruce", city: "Delhi" }], con = [{ city: "London", continent: "Europe" }, { city: "Delhi", continent: "Asia" }, { city: "Seattle", continent: "North America" }, { city: "Paris", continent: "Europe" }, { city: "New York", continent: "North America" }, { city: "Rome", continent: "Europe" }, { city: "Bengaluru", continent: "Asia" }, { city: "Los Angeles", continent: "North America" }], continents = Object.fromEntries(con.map(({ city, continent }) => [city, continent])); per.sort((a, b) => continents[a.city].localeCompare(continents[b.city])); console.log(per);

 .as-console-wrapper { max-height: 100%;important: top; 0; }

Answer 2

它实际上比你想象的要简单。 这是一个使用 Array.prototype.sort() 和 String.prototype.localeCompare() 的方法

Mozilla Web Docs 对此有很好的文档； 查看https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#sorting_non-ascii_characters

 const per = [ {name:"Mary", city:"London"}, {name:"Anita", city:"Paris" }, {name:"Edward", city:"New York"}, {name:"Thomas", city:"Rome"}, {name:"Robin", city:"Seattle"}, {name:"Sophia", city:"Los Angeles"}, {name:"Bruce", city:"Delhi"} ], con = [ {city:"London", continent:"Europe"}, {city:"Delhi", continent:"Asia"}, {city:"Seattle", continent:"North America"}, {city:"Paris", continent:"Europe"}, {city:"New York", continent:"North America"}, {city:"Rome", continent:"Europe"}, {city:"Bengaluru", continent:"Asia"}, {city:"Los Angeles", continent:"North America"} ], findContinent = (cityToFind) => con.find(({ city }) => city === cityToFind).continent, // This line finds the city from "con". I've extracted the function here instead of using.find() inline to prevent repitition. This also means that you can add in some null checks here if you really want. sortCountriesByContinent = () => per.sort((a, b) => { return findContinent(a.city).localeCompare(findContinent(b.city)); // Sorts "per" by using the.localeCompare() method and using the findContinent() function we made earlier. }); console.log(sortCountriesByContinent());

---

相反，我们还可以将“con”中的属性合并到“per”中，这样就更容易了。 我们可以使用 for/forEach 循环，但展开语法更简单：

 const per = [ {name:"Mary", city:"London"}, {name:"Anita", city:"Paris" }, {name:"Edward", city:"New York"}, {name:"Thomas", city:"Rome"}, {name:"Robin", city:"Seattle"}, {name:"Sophia", city:"Los Angeles"}, {name:"Bruce", city:"Delhi"} ], con = [ {city:"London", continent:"Europe"}, {city:"Delhi", continent:"Asia"}, {city:"Seattle", continent:"North America"}, {city:"Paris", continent:"Europe"}, {city:"New York", continent:"North America"}, {city:"Rome", continent:"Europe"}, {city:"Bengaluru", continent:"Asia"}, {city:"Los Angeles", continent:"North America"} ], sortCountriesByContinent = () => per.map((data) => { // Return a new object, with the name, city, and continent properties. return {...con.find(({ city }) => city === data.city), // Find city from "con", and join its properties with this new object (city, continent). The duplicates shouldn't cause an issue (at least not for me). ...data // Join the original properties (name, city) with the new object }; }).sort((a, b) => a.continent.localeCompare(b.continent)) // Once again, we sort using.localeCompare(), but this time we can directly use the.continent property.map((data) => delete data.continent && data); // Optional, but removes continent property from data. This always returns true (tmk), so we can use an "and" operator to return data. console.log(sortCountriesByContinent());

请参阅如何动态合并两个 JavaScript 对象的属性？ 关于创建两个对象的联合。