JavaScript变量"name"类型为string且等于null，判断==null返回false的问题

这问题我刚碰到的时候也挠了半天头，其实罪魁祸首是浏览器自带的全局内置属性window.name！

问题根源 #

在浏览器的全局作用域里，用var声明的变量会自动挂载到window对象上。而window.name是浏览器原生就有的属性，它原本用来存储当前窗口的名称，而且被强制限定为字符串类型——任何赋值给它的非字符串值都会被自动转成字符串。

当你点击prompt的取消按钮时，prompt返回的是null，但：

• 给var name赋值时，实际上是在给window.name赋值，null被强制转换成了字符串"null"
• 而var password没有对应的内置window属性，所以正常存储了null值

这就导致：

• name == null 等价于 "null" == null，结果自然是false
• password == null 就是 null == null，结果为true

验证一下 #

你可以在控制台加两行打印确认：

var name = prompt('What is your name?', '');
console.log(typeof name); // 输出 "string"
console.log(name); // 输出 "null"（字符串类型）

var password = prompt('Password?', '');
console.log(typeof password); // 输出 "object"（JS里null的typeof是个小坑）
console.log(password); // 输出 null

解决方案 #

有几种简单的办法避开这个坑：

• 换个变量名，比如userName、fullName，避开name这种有内置含义的全局变量
• 用let或const声明变量（它们不会挂载到window对象上，不会和window.name冲突）：

  let name = prompt('What is your name?', '');
  console.log(name == null); // 点击取消后返回true，正常工作
  

• 在函数内部声明变量，让变量处于局部作用域，不会影响全局的window.name

内容的提问来源于stack exchange，提问作者Heidel