JavaScript 对象属性枚举顺序：数字键与插入顺序

结论

• 对象属性键如果是“纯数字字符串”（例如 "2024"、"1"、"10"），JavaScript 会把它们当成整数索引处理。
• 这类键在对象枚举时，不再按插入顺序返回，而是按“数值升序”返回。
• 因此，Object.fromEntries() 生成对象后，即使按降序插入 [["2024", ...], ["2023", ...]]，遍历时仍会先返回 2023 再 2024。

规范行为

对象枚举顺序规则：

1. 所有整数索引型键，按数值升序排列。
2. 其余字符串键，按插入顺序排列。
3. Symbol 键，按插入顺序排列。

示例

例子 1：纯数字键对象

const obj = {};
obj["2024"] = "A";
obj["2023"] = "B";
console.log(Object.keys(obj)); // ["2023", "2024"]

即使插入顺序是 2024、2023，输出依然是升序。

例子 2：非纯数字键对象

const obj = {};
obj["year2024"] = "A";
obj["year2023"] = "B";
console.log(Object.keys(obj)); // ["year2024", "year2023"]

这时会保留插入顺序。

当前场景分析

• groupedAlbumList 的 key 是 YYYY，属于“纯数字字符串”。
• 因此不能依赖对象遍历得到倒序结果。
• 如果需要按年份倒序，推荐方式：
  • 返回 Array 的 [[year, albums], ...] 结构。
  • 或者使用 Map。
  • 或把 key 改成非纯数字字符串（例如 "year-2024"）。

推荐方案

const sortedGroupedAlbumList = computed(() =>
  Object.entries(groupedAlbumList.value)
    .sort((a, b) => Number(b[0]) - Number(a[0]))
)

该结果是数组，顺序稳定，可直接用于模板循环。