JavaScript 加性、关系与等性运算符特殊行为详解

叶初

发布时间：2026-10-15| 4人浏览过

原创

深入解析 JavaScript 中加法、减法、关系判断及相等比较运算符的特殊行为，重点说明 NaN 处理、字符串转换规则及 == 与 === 的区别，帮助开发者避免隐式转换带来的逻辑错误。

1. 结果与目标

掌握 JavaScript（ECMAScript）核心运算符在混合类型或极端值（如 NaN、Infinity）下的计算结果，明确何时进行数值转换、何时进行字符串拼接，以及如何正确判断两个值的相等性。

2. 准备条件

基础 JavaScript 运行环境（浏览器控制台或 Node.js）。
了解基本数据类型：Number、String、Boolean、Null、Undefined 及对象引用。

3. 真实操作顺序与细节分析

第 1 步：理解加性运算符（+ 和 -）的类型转换逻辑

目的：明确加法是“数学相加”还是“字符串拼接”，减法是纯数值运算的特殊情况。

关键规则与参数：

加法运算符 (+)：

若两边均为数字，执行数学加法。
若至少有一边为字符串，另一边也会被转换为字符串并执行连接。
若含 NaN，结果为 NaN；Infinity + Infinity 为 Infinity；Infinity + (-Infinity) 为 NaN。

减法运算符 (-)：

始终尝试将操作数转换为数字。若无法转换（如汉字），结果为 NaN。
Infinity - Infinity 和 -Infinity - (-Infinity) 结果均为 NaN。

可观察的完成状态：通过 console.log 验证以下典型场景：

// 加法：字符串优先拼接
console.log("abc" + "bcd"); // "abcbcd"
console.log(5 + "5");       // "55"

// 加法：NaN 污染
console.log(NaN + 1);       // NaN

// 减法：非数字转失败
console.log("abc" - "a");   // NaN
console.log("5" - 5);       // 0 （成功转换后相减）

第 2 步：掌握关系运算符（< > <= >=）的比较策略

目的：确定数值比较与字典序（ASCII码）比较的触发条件。

关键规则：

若两边都是数字，直接比较大小。
若两边都是字符串，按字符的 Unicode/ASCII 码逐一比较。
若一边是字符串，另一边是数字，则将字符串转换为数字后进行数值比较。
注意：任何涉及 NaN 的关系运算结果均为 false（包括不等于自身的情况，但在关系运算中表现为返回 false，而非报错）。

可观察的完成状态：

console.log("B" < "a");      // true （ASCII 'B'(66) < 'a'(97)）
console.log("13" < "2");     // true （字符串按位比较，'1' < '2'）
console.log(13 < "2");       // false （"2" 转为 2，13 > 2）
console.log(-1 < "a");       // false （"a" 转为 NaN，任何含 NaN 的关系运算返回 false）

第 3 步：区分等性运算符（== vs ===）的转换机制

目的：消除因自动类型转换导致的 Bug，选择正确的相等判断方式。

关键规则：

== (等号/松散相等)

执行隐式类型转换后再比较。
null 只等于 undefined，两者互不等其它值。
NaN 不等于任何值，包括它自己（NaN == NaN 为 false）。
布尔值 true 转 1，false 转 0。

=== (全等号/严格相等)

不执行类型转换。
只有当类型相同且值相同时才返回 true。
推荐在日常开发中使用 === 以避免不可预期的转换。

可观察的完成状态：

// == 的行为
console.log(null == undefined); // true
console.log(NaN == NaN);        // false （重要陷阱！）
console.log("5" == 5);          // true （字符串转数字）

// === 的行为
console.log("5" === 5);         // false （类型不同：String vs Number）
console.log(NaN === NaN);       // false （任何类型的 NaN 都不等）

第 4 步：使用条件与赋值简化逻辑

目的：利用三元运算符和复合赋值符提升代码简洁性。

动作与参数：

三元运算符 (? :)：condition ? expr1 : expr2。例如求最大值：x >= y ? x : y。
复合赋值 (+=, -=, *= 等)：作为 a = a op b 的简写，如 iNum += 10 等同于 iNum = iNum + 10。
逗号运算符 (,)：在同一条语句中执行多个表达式，通常用于变量声明：var a=1, b=2;。

4. 完成判断

能够正确预测任意两个不同类型或非标准数值（NaN, Infinity）在进行加减、比较时的输出结果；能在代码中合理选用 == 或 ===。

5. 原文有依据的排错

NaN 比较陷阱：许多开发者误以为 NaN != NaN 为真即代表检测到了 NaN，实际上在 JS 中应使用 isNaN() 全局函数或 ES6 的 Number.isNaN() 来安全判断，因为 NaN 与任何值（包括自身）的直接比较都返回 false。
字符串关系比较误区："13" < "2" 返回 true 是因为它们被当作字符串逐位比较（'1' < '2'），而非数值比较（13 > 2）。务必注意操作数是否仍保持字符串类型。