JavaScript 有时看起来很简单，但其中的一些细节常常容易让人犯错。下面有 7 个问题，涵盖了 JavaScript 的一些常见概念和陷阱。看似简单的问题，其实暗藏玄机。如果你能顺利回答这些问题，说明你对 JavaScript 已经有了不错的理解！

问题1

问题：0.1 + 0.2 === 0.3 的结果是什么？

console.log(0.1 + 0.2 === 0.3);

答案：

    结果是 false。

解释：

JavaScript 中的小数（也就是浮点数）并不是总能精确表示。由于浮点数在计算机中的存储方式，0.1 + 0.2 实际的结果并不是我们期望的 0.3，而是 0.30000000000000004。所以当你做比较时，结果是 false。这主要是因为二进制系统无法完全精确表示某些十进制小数。

问题2

问题："5" + 3 和 "5" - 3 的结果分别是什么？

console.log("5" + 3);
console.log("5" - 3);

答案：

•  "5" + 3 结果是 "53"。

•  "5" - 3 结果是 2。
  

解释：

•  "5" + 3：当加号 + 出现在字符串和数字之间时，JavaScript 会把数字转换为字符串，并拼接在一起。所以 "5" + 3 结果是 "53"。

• "5" - 3：减号 - 不会作用于字符串，因此 JavaScript 会将 "5" 转换为数字 5，然后执行减法运算，所以结果是 2。

问题3

问题：typeof null 的结果是什么？

console.log(typeof null);

答案：

结果是 "object"。

解释：

这是 JavaScript 中一个有趣且常见的现象。null 实际上表示“没有值”或“空”，但是 typeof null 的结果是 "object"。这是 JavaScript 早期设计中的一个 bug，虽然已经知道问题，但为了兼容旧代码一直没有修复。

问题4

问题：什么是闭包？它是如何工作的？

function outerFunction() {
  let count = 0;
  return function() {
    count++;
    console.log(count);
  };
}

const closure = outerFunction();
closure(); // ?
closure(); // ?

答案：

输出结果是：

1
2

解释：

闭包指的是一个函数可以记住它所在的环境（变量），即使这个函数被外部调用，它仍然能访问定义时的作用域。上面的例子中，closure 是 outerFunction 的内部函数，它可以访问 count 变量，每次调用 closure() 时都会递增并打印 count 的值。这样通过闭包，我们可以让函数保持对外部变量的引用。

问题5

问题：true + false 和 [] + {} 的结果分别是什么？

console.log(true + false);
console.log([] + {});

答案：

•  true + false 的结果是 1。

•  [] + {} 的结果是 "[object Object]"。

解释：

•  true + false：在 JavaScript 中，true 相当于 1，false 相当于 0，所以 true + false 就是 1 + 0，结果是 1。

• [] + {}：空数组 [] 转换为字符串时会变成 ""（空字符串），空对象 {} 转换为字符串时会变成 "[object Object]"，所以结果是 "[object Object]"。

问题6

问题：[] == ![] 的结果是什么？

console.log([] == ![]);

答案：

    结果是 true。

解释：

这个表达式比较复杂，但可以一步步拆解：

1. ![] 是对空数组取反，空数组是一个“真值”（truthy），所以 ![] 是 false。

2. 表达式变成了 [] == false。

3. JavaScript 在比较时会将 [] 转换为空字符串 ""，并将 false 转换为 0。

4. 然后 "" == 0 结果是 true，因为在 JavaScript 中空字符串会被转换为 0 进行比较。

问题7

问题：以下代码中 console.log(a) 的输出是什么？

console.log(a);
var a = 5;

答案：

    输出是 undefined。

解释：

这是因为 JavaScript 的变量提升机制。在执行代码前，JavaScript 会将变量声明提升到作用域的最上方，但不会提升赋值部分。所以上面的代码实际上等同于：

var a;
console.log(a); // undefined
a = 5;

因此，当执行 console.log(a) 时，变量 a 已经声明，但还没有被赋值，所以结果是 undefined。

结论

    这些问题展示了 JavaScript 中常见的“坑”，包括浮点数的精度问题、隐式类型转换、闭包的工作原理、以及变量提升等概念。理解这些内容可以帮助你更好地编写代码，避免常见的错误。

本文首发于公众号“web前端开发之旅”，转载请注明出处！