JS 类型转换避坑指南：别在面试官面前翻车

JavaScript 的隐式类型转换简直是给开发者准备的“心理陷阱”，尤其是那些 [] + {} 之类的骚操作，如果不清楚底层逻辑，纯靠猜的话正确率不到 30%。

很多面试官喜欢用这种一行代码考你对 JS 引擎底层 ToPrimitive 机制的理解。其实核心逻辑就一条：+ 号两边只要有一个被转成了字符串，结果就是字符串拼接；否则才尝试走数字运算。

这里整理了几个最容易踩坑的实战案例：

一、数组与对象的“化学反应”

最经典的就是空数组和空对象的加法，记住：String([]) 是空字符串 ""，而 String({}) 是 "[object Object]"。

// 案例 1：空数组 + 空数组
console.log([] + []); 
// 结果："" (空字符串)
// 逻辑："" + "" = ""

// 案例 2：空数组 + 空对象
console.log([] + {}); 
// 结果："[object Object]"
// 逻辑："" + "[object Object]" = "[object Object]"

二、最阴险的括号陷阱

注意 {} 在 JS 里的双重身份：它既可以是对象字面量，也可以是一个代码块（Block）。

// 场景 A：在括号内，{} 被视为对象
console.log(({} + [])); 
// 结果："[object Object]"

// 场景 B：直接写在控制台或 eval 中，{} 可能被解析为代码块
// 此时代码变成了： (空代码块) + [].toString()
// 结果："" (或者在某些环境下是 0，取决于解析器对空块的处理)

三、关于 NaN 的离谱逻辑

NaN（Not a Number）是 JS 里唯一一个不等于自身的数值。

console.log(NaN === NaN); 
// 结果：false

// 避坑指南：判断是否为 NaN 不要用 ===，得用这两个：
console.log(Number.isNaN(NaN)); // true
console.log(Object.is(NaN, NaN)); // true

总结一下几个高频转换结果，建议直接背诵：

• 空数组 [] → 字符串变 "" → 数字变 0
• 空对象 {} → 字符串变 "[object Object]" → 数字变 NaN
• null → 字符串变 "null" → 数字变 0
• undefined → 字符串变 "undefined" → 数字变 NaN

下次面试被问到这种题，直接从 ToPrimitive 转换规则切入分析，比直接报答案显得专业得多。