如何对Object.keys(categorizedDatas3)的结果按A-Z排序后执行map？

要让categorizedDatas3的键按A-Z排序（确保4x4显示在Boat前面），只需在映射前对Object.keys()返回的键数组做排序处理即可：

基础实现（满足你的需求） #

直接用数组默认的sort()方法，因为数字字符的Unicode码点小于字母，"4x4"会自然排在"Boat"前面：

{Object.keys(categorizedDatas3).sort().map((key, index) => {
  // 这里写你原来的映射逻辑
})}

通用不区分大小写排序（应对后续可能的大小写混合键） #

如果之后有大小写混合的键，用localeCompare()做自然语言排序更靠谱：

{Object.keys(categorizedDatas3).sort((a, b) => a.localeCompare(b)).map((key, index) => {
  // 这里写你原来的映射逻辑
})}

补充说明 #

Object.keys()返回的键数组顺序在现代浏览器里虽和对象定义顺序一致，但要保证严格的A-Z排序，必须显式调用sort()。默认排序按字符的Unicode码点排列，数字比字母靠前，刚好符合你要4x4在Boat前面的要求；localeCompare()则会遵循自然语言的排序规则，能处理大小写忽略、多语言适配等场景。

内容的提问来源于stack exchange，提问作者Paul VI