如何在Js中按关键字筛选和排序对象

Question

我正在尝试在React应用程序中按键对对象进行排序。我有一个对象(data(和字符串值(someString(，我需要根据someString的值按相同的顺序按其键对obj进行排序和筛选。到目前为止，我能够根据someString中的键值对对象进行筛选和排序，问题是我不知道如何在按键排序后显示对象的值，现在只显示键。

我的代码是：

import "./styles.css";
export default function App() {
const data = {
info: {
name: "Jane Smith",
info: "26 years old"
},
newInfo: {
name: "John Smith",
info: "35 years old"
},
updatedInfo: {
name: "James Smith",
info: "45 years old"
},
latestUpdate: {
name: "J D",
info: "23 years old"
}
};
let someString = "newInfo,latestUpdate,updatedInfo";
let newData = Object.keys(data)?.filter((i) => someString.includes(i));
const sorted = newData.sort((a, b) => {
const aIndex = someString.indexOf(a);
const bIndex = someString.indexOf(b);
return aIndex - bIndex;
});
console.log(sorted, "sorted");

return <div className="App">{sorted}</div>;
}

代码沙箱

代码显示"；排序"；作为

0: "newInfo"
1: "latestUpdate"
2: "updatedInfo"

但我需要排序的对象也有这样的值：

newInfo: {
name: "John Smith",
info: "35 years old"
},
latestUpdate: {
name: "J D",
info: "23 years old"
},
updatedInfo: {
name: "James Smith",
info: "45 years old"
},

Answer 1

排序后，将它们转换为具有Object.fromEntries:的对象

const data = {
info: {
name: "Jane Smith",
info: "26 years old"
},
newInfo: {
name: "John Smith",
info: "35 years old"
},
updatedInfo: {
name: "James Smith",
info: "45 years old"
},
latestUpdate: {
name: "J D",
info: "23 years old"
}
};
const someString = "newInfo,latestUpdate,updatedInfo";

const keys = Object.keys(data).filter(key => someString.includes(key));
const sortedObj = Object.fromEntries(
keys
.sort((a, b) => someString.indexOf(a) - someString.indexOf(b))
.map(key => [key, data[key]])
);
console.log(sortedObj);