Javascript 如何按年龄值对该数组进行排序?
我现在正在学习,从reactjs开始,我必须使用API制作一个基于《权力的游戏》的网页,我接收API数据,我可以在屏幕上打印人物的img、姓名和年龄,但我需要按年龄对他们进行排序 componentDidMount(){ json项目示例:Javascript 如何按年龄值对该数组进行排序?,javascript,arrays,reactjs,Javascript,Arrays,Reactjs,我现在正在学习,从reactjs开始,我必须使用API制作一个基于《权力的游戏》的网页,我接收API数据,我可以在屏幕上打印人物的img、姓名和年龄,但我需要按年龄对他们进行排序 componentDidMount(){ json项目示例: 0 titles […] origin […] siblings […] spouse […] lovers [] plod 0 longevity [] plodB 0 plodC 0 longevityB [] l
0
titles […]
origin […]
siblings […]
spouse […]
lovers []
plod 0
longevity []
plodB 0
plodC 0
longevityB []
longevityC []
culture […]
religion […]
allegiances […]
seasons []
appearances […]
_id "5cc0757c04e71a0010b86ac3"
name "Eddard Stark"
slug "Eddard_Stark"
image "https://vignette.wikia.n…wn/323?cb=20160730050722"
gender "male"
alive false
death 298
father "Rickard Stark"
house "House Stark"
first_seen "Winter Is Coming\""
actor "Sean Bean"
related […]
createdAt "2019-04-24T14:41:00.761Z"
updatedAt "2019-04-24T14:41:00.761Z"
__v 0
pagerank {…}
age :
name "Eddard Stark"
age 60
id "5cc0757c04e71a0010b86ac3"
但是idk我必须在我的代码中准确地编写它并使其工作,我还必须制作一个按钮,在那里我可以从小调到大调再到相反的顺序,非常感谢如果你能帮助我,我昨天一整天都在做这件事,很抱歉没有一个完美的英语,希望你能理解一切:p
您可以链接一些数组操作,如排序和筛选,因此解决方案是首先筛选出没有年龄的字符,然后对结果进行排序:
characters.filter(character=>character.age).sort(compareFunction);
然后,可以在JSX中使用它来按顺序显示不带年龄的字符:
返回(
{项目
.filter(item=>item.age&&item.age.age)
.sort((上一个,下一个)=>prev.age-next.age)
.map(项目=>(
-
名称:{item.Name}年龄:{item.age.age}
))}
);
下面是一个删除没有年龄的字符并按升序和降序排列年龄的工作示例:
功能显示列表(列表){
让html='';
for(名单上的常数人){
html+=`${person.name}:${person.age | | |“?”} `;
}
document.getElementById('age-list')。innerHTML=html;
}
常数表=[{
姓名:“约翰”,
年龄:12
},
{
姓名:“蒂姆”
},
{
姓名:“史蒂文”,
年龄:40
},
{
姓名:“玛丽”,
年龄:50
},
{
姓名:“艾米”
},
{
姓名:“谢尔顿”,
年龄:5
},
{
姓名:“夏洛特”,
年龄:25
}
];
显示列表(年龄列表);
document.getElementById('asc')。onclick=()=>{
const ascList=ageList.filter(item=>item.age).sort((上一页,下一页)=>{
返回prev.age-next.age;
});
显示列表(ascList);
}
document.getElementById('desc')。onclick=()=>{
const ascList=ageList.filter(item=>item.age).sort((上一页,下一页)=>{
返回next.age-prev.age;
});
显示列表(ascList);
}
升序
下降的
你能添加示例数据吗?@Rajesh有一些字符,例如,Eddard Stark确实有60岁,Robb Stark 33岁,因此在页面中应该首先出现Robb Stark,请以JSON格式在问题中添加一个项数组的示例。这回答了你的问题吗?他们已经知道如何排序。项s、 排序((a,b)=>a.item.age.age-b.item.age.age)
他们的问题是“一些不知道年龄的字符”确切地说,我知道如何排序,我的问题是在那个数据库中有一些没有年龄的字符,这就是为什么我使用这个过滤器{items.filter(item=>item.age&&item.age.age)使用该过滤器,所有字符都会出现,避免出现没有年龄的字符,但idk如何在我已有的代码中插入排序。我已更新了答案,以考虑没有年龄属性的对象。问题是,我无法打印没有年龄的字符,因此不能打印没有年龄的字符。:S但感谢您的帮助嗯。我不太理解你的问题。你想过滤掉没有年龄的字符,然后按年龄对剩下的字符排序吗?
items.sort((a,b) => a.item.age.age - b.item.age.age)
0
titles […]
origin […]
siblings […]
spouse […]
lovers []
plod 0
longevity []
plodB 0
plodC 0
longevityB []
longevityC []
culture […]
religion […]
allegiances […]
seasons []
appearances […]
_id "5cc0757c04e71a0010b86ac3"
name "Eddard Stark"
slug "Eddard_Stark"
image "https://vignette.wikia.n…wn/323?cb=20160730050722"
gender "male"
alive false
death 298
father "Rickard Stark"
house "House Stark"
first_seen "Winter Is Coming\""
actor "Sean Bean"
related […]
createdAt "2019-04-24T14:41:00.761Z"
updatedAt "2019-04-24T14:41:00.761Z"
__v 0
pagerank {…}
age :
name "Eddard Stark"
age 60
id "5cc0757c04e71a0010b86ac3"