如何按key升序排序localStorage并输出对应键值对

可直接复用的实现流程 #

整体操作不需要复杂转换，核心逻辑如下：

• 从localStorage中提取全量键名，不需要提前把所有值加载到内存
• 对键名做数值维度的升序排序，不要直接用默认的字符串字典序排序
• 按排序后的键名顺序，逐个从localStorage中取出对应值输出

可直接运行的代码示例：

// 提取localStorage内所有键名
const rawKeys = Object.keys(localStorage);

// 按键名对应的毫秒数值升序排序
const sortedKeys = rawKeys.sort((prev, next) => Number(prev) - Number(next));

// 按排序顺序组装键值对结果
const orderedData = sortedKeys.map(k => ({
  键名: k,
  对应值: localStorage.getItem(k)
}));

// 表格形式输出结果，方便查看
console.table(orderedData);

关于是否需要新建中间变量的说明 #

• 上述代码中的几个中间变量是排序流程必需的，但完全不需要把localStorage的全量键值对复制成独立的JS变量做存储。localStorage本身是同步的键值存储结构，提前把所有value捞到内存里反而会造成不必要的内存开销，尤其当存储的value体积较大时。
• 只需要把键名数组取出来完成排序，排序过程不需要读取对应的value值，等排序完成后再按顺序读取value就可以。
• 一定要避开的排序坑：如果直接用数组默认的无参sort()方法，会按照字符串字典序比较键名，比如会把"1000"排在"999"前面，完全不符合数字升序的预期，必须显式把键名转成数字做差值比较。

内容的提问来源于stack exchange，提问作者Björn C