array.prototype.sort()的不稳定性不会直接导致ui错位，但当存在重复值且未用稳定比较函数时，会使等值元素顺序错乱，引发同价商品排序跳变、评分头像乱序、分页重复项及key为索引时的dom复用异常。
Array.prototype.sort() 的底层不稳定性，本身不会直接导致 UI 列表“错位”，但它会在特定场景下引发视觉或逻辑上的顺序异常——尤其是当多个元素值相等、又依赖原始输入顺序呈现时。这种影响不是随机跳动，而是可复现的、与数据特征和运行环境强相关的排序偏移。
看懂“不稳定”在 UI 中的实际表现
稳定性指：若两个元素 a 和 b 满足 a === b（或业务上视为相等），且 a 原本在 b 前面，稳定排序会保证 a 仍排在 b 前面；不稳定排序则可能交换它们的位置。
在 UI 列表中，这常体现为：
- 同价格商品在表格中上下顺序反复切换（刷新或重排后原序丢失）
- 多人提交相同评分，头像/昵称排列顺序每次渲染不一致
- 带分页的列表中，第一页末尾和第二页开头出现“重复项错位”（实为同一组等值数据被拆散重排）
- 使用
key依赖索引（如:key="index"）时，React/Vue 可能触发非预期的 DOM 复用或销毁，造成动画错乱或状态错绑
哪些情况会让不稳定性真正暴露出来
不是所有排序都会出问题。以下条件同时满足时，风险显著升高：
- 排序字段存在大量重复值（如 status: "pending" 占 60%）
- 未传入比较函数，或比较函数未处理相等情况（例如只写
(a, b) => a.time - b.time，但 time 相同时无兜底） - 运行在旧版浏览器或不确定引擎环境中（如 Electron 旧内核、部分安卓 WebView）
- UI 层把数组索引当作唯一标识（例如用
v-for="(item, i) in list" :key="i"）
快速验证当前是否受影响
不需要读 V8 源码，三步现场检测：
- 构造一个含重复值且带原始位置标记的数组：
const data = [{id:1, score:85, idx:0}, {id:2, score:85, idx:1}, {id:3, score:92, idx:2}, {id:4, score:85, idx:3}] - 执行排序：
data.sort((a,b) => a.score - b.score) - 检查所有
score === 85的项，其idx是否保持升序（0→1→3）。若顺序变成 1→0→3 或 3→1→0，说明当前环境已表现出不稳定性
稳妥应对策略
不依赖引擎实现，从代码层切断风险：
- 对等值数据强制保序：在比较函数中加入原始索引兜底
.sort((a,b) => a.score - b.score || a.idx - b.idx) - 避免就地排序干扰状态：用
toSorted()替代sort()（ES2023+，不改原数组，且现代引擎下更易保持行为一致） - UI key 不用索引：改用唯一业务字段（如
:key="item.id"），彻底解耦渲染顺序与排序结果 - 高一致性要求场景（如金融订单列表）：直接选用归并排序等天然稳定算法封装，或引入
stable-sort等轻量库
