JavaScript 数组排序：如何将数字升序排列并将 NaN 放置在末尾-js教程-PHP中文网

JavaScript 数组排序：如何将数字升序排列并将 NaN 放置在末尾

本文详解如何对包含 nan 的 javascript 数组进行稳定、可预测的排序——使数值按升序排列，所有 nan 值统一置于数组末尾，并解释为何默认比较函数在遇到 nan 时失效。

本文详解如何对包含 nan 的 javascript 数组进行稳定、可预测的排序——使数值按升序排列，所有 nan 值统一置于数组末尾，并解释为何默认比较函数在遇到 nan 时失效。

在 JavaScript 中，Array.prototype.sort() 默认将元素转为字符串比较，而当传入自定义比较函数（如 (a, b) => a - b）时，若任意操作数为 NaN，减法运算结果恒为 NaN；而 sort 函数要求比较函数返回一个数字（负数、零或正数），但 NaN 被视为 falsy 且不可用于逻辑判断——这导致排序算法无法确定元素相对顺序，从而产生未定义行为（例如元素位置随机、NaN“漂移”、甚至原地乱序）。这也是你发现 a - b 和 b - a 得到相同结果的原因：两者在涉及 NaN 时均返回 NaN，sort 内部将其视作 0 或忽略比较，最终依赖引擎实现，失去可预测性。

要实现「数值升序 + NaN 置后」的目标，关键在于优先区分 NaN 与有效数字，再对数字部分做常规排序。推荐使用以下健壮写法：

const array = [5, 9, NaN, 3, 15];

// 升序：NaN 排最后，其余数字升序
const sortedAsc = [...array].sort((a, b) => {
  // 第一优先级：NaN 判断 —— isNaN(a) 返回 1（true）或 0（false）
  // isNaN(a) - isNaN(b) 结果为：-1（a非NaN, b是NaN）、0（同为NaN或同为数字）、1（a是NaN, b非NaN）
  // 利用短路逻辑：若 NaN 判定不同，则直接返回；否则继续比较数值
  return isNaN(a) - isNaN(b) || a - b;
});

console.log(sortedAsc); // [3, 5, 9, 15, NaN]

该方案核心在于 isNaN(a) - isNaN(b) 的巧妙设计：

Alibabacloud Sdk Client Initialization For Java

在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。

下载

isNaN(x) 对 NaN 返回 true（即 1），对其他值返回 false（即 0）；
因此 isNaN(a) - isNaN(b) 可产生 -1 / 0 / 1，天然符合 sort 所需的三态返回规范；
|| 短路确保仅当二者均为有效数字（即 isNaN(a) === isNaN(b) === false，差值为 0）时，才执行 a - b 进行数值排序。

⚠️ 注意事项：

始终使用扩展运算符 [...array] 创建副本：避免原数组被意外修改（sort() 是原地操作）；
不要依赖 a == a 或 a !== a 判 NaN：虽 a !== a 是 NaN 的可靠检测方式，但 isNaN() 更语义清晰且兼容旧环境（ES5+）；
若需降序（数字降序 + NaN 在末尾），仅需将数值比较部分改为 b - a：
```
[...array].sort((a, b) => isNaN(a) - isNaN(b) || b - a)
// → [15, 9, 5, 3, NaN]
```
对于 null、undefined 或字符串数字等混合类型，需额外类型预处理，本方案默认假设输入为数字或 NaN。

总结：处理含 NaN 的排序，本质是分层比较——先按「是否为 NaN」分组，再在组内排序。这一模式可扩展至更复杂场景（如 null/undefined 置后、自定义空值策略），是编写健壮数据处理逻辑的重要实践。