JS 判断字符串是否为空

1.数据类型

从 ES6 开始，JS 共有 7 种数据类型，分为基本类型和引用类型两大类。

基本类型：String、Number、Boolean、Symbol、Undefined、Null 引用类型：Object（object、array、function） 

typeof 运算符返回变量或表达式的类型，通过 typeof 运算符可以粗略确定 JavaScript 变量的类型。

typeof '' // "string" typeof 'Bill Gates' // "string" typeof 0 // "number" typeof 3.14 // "number" typeof false // "boolean" typeof true // "boolean" typeof Symbol() // "symbol" typeof undefined // "undefined" typeof null // "object" typeof { 
   name:'Bill', age:62} // "object" typeof [0, 1, 2] // "object" typeof function(){ 
   } // "function" typeof (()=>{ 
   }) // "function" 

需要注意的是，对 null、数组执行 typeof 结果是 “object”。

JS 是解释型弱类型编程语言，定义变量时无需指明类型，变量类型在程序执行时由实际值的类型决定，且可以直接赋予不同类型值来改变变量类型。

var foo = 'foo' foo = 123 console.log(foo) // 123 

2.正确优雅地判断字符串是否为空

弱类型给编程带了方便，但有这种灵活的成本并不廉价，因为一不小心就会出错。比如我们判断一个变量是空字符串可能会写成下面这个样子。

function isEmptyStr(s) { 
    if (s == '') { 
    return true } return false } 

如果之前经常写强类型语言，第一次写 JS 的话，很容易写出上面这种代码。但是因为 JS 是弱类型语言，只有执行表达式时才能确定 s 的类型，所以 s 可能并不是字符串类型，如果 s 是 undefined 或者 null，也认为是空的话，那么s == ''并不成立，得出错误的判断。把 undefined 和 null 当做空字符串。代码修改如下：

function isEmptyStr(s) { 
    if (s == undefined || s == null || s == '') { 
    return true } return false } isEmpty(undefined) // true isEmpty(null) // true isEmpty('') // true 

这样就对了吗？当你看到下面的结果，你可能跟我一样，想打人。

isEmptyStr(0) // true isEmptyStr(false) // true 

我只想安静地判断一个变量是不是空串，为啥 JS 给我整出这么多幺蛾子。这是因为 JS 把 0 和 false 的值与空串认为是等同的，所以出现了上面这种诡异的情况。我们需要使用 === 运算符加上类型的判断。JS 中 == 只判断值，=== 运算符需要在类型和值两方面同时相等才判为 true。

function isEmptyStr(s) { 
    if (s == undefined || s == null || s === '') { 
    return true } return false } 

有没有更简洁的写法呢？实际上 null 与 undefined 虽然不是东东，但是 JS 中规定，二者的值是相等的，只是类型不同。

null == undefiend // true null === undefined // false 

所以上面判断字符串是否为空串可以简写为：

function isEmptyStr(s) { 
    if (s == null || s === '') { 
    return true } return false } // 或 function isEmptyStr(s) { 
    if (s == undefined || s === '') { 
    return true } return false } isEmptyStr(undefined) // true isEmptyStr(null) // true isEmptyStr('') // true 

3.不是空串一定是“不空串”吗？

判断字符串是否为空可能会有人从相反的角度出发，即判断字符串不为空。

function isEmptyStrV2(s) { 
    if (typeof s == 'string' && s.length > 0) { 
    return false } return true } isEmptyStrV2(undefined) // true isEmptyStrV2(null) // true isEmptyStrV2('') // true 

细心的同学会发现，上面这个函数实际上并非和函数 isEmptyStr() 完全等同，因为当输入 undefined，null 和字符串类型外的变量时，两个函数的结果是不一样的。

// 对象 isEmptyStr({ 
   }) // false isEmptyStrV2({ 
   }) // true // 布尔 isEmptyStr(false) // false isEmptyStrV2(false) // true // 数值 isEmptyStr(1) // false isEmptyStrV2(1) // true 

出现这种情况的原因是入参可能并不是字符串，所以上面函数 isEmptyStrV2() 的结果是错误的，isEmptyStr() 的结果是对的，但是使用 isEmptyStr() 时也要注意不是空串不代表是不空串（有长度的字符串）。听起来有点难理解，这就是弱类型语言灵活带来的不便，给 coder 犯错提供了非常多的机会。

因为不是空串不代表是不空串，所以判断是否是空串不能从相反的角度出发，上面的函数 isEmptyStrV2() 是不可用的，还是需要直接判断是空串才行，因为空串和有长度的字符串之间还存在着小三（其他类型），三者关系如下：

同样地，当我们需要判断一个变量是有长度的字符串时，不能直接使用函数 isEmptyStr()，也要直接判断才行。

function isNotEmptyStr(s) { 
    if (typeof s == 'string' && s.length > 0) { 
    return true } return false } 

弱类型语言就是如此地任性，让我们这些经常写强类型语言的 coder 一下子有些难以适从。

4.小结

因为 JS 是弱类型语言，导致入参类型可能不是字符串，这给判断字符串是否为空带了很多不便。不是空串并不代表是不空串，所以判断字符串为空还是不为空要单独判断。

此外，在比较两个变量是否相等时，要注意什么时候使用 === 执行严格相等，什么时候使用 == 执行宽松相等的比较。

判断字符串为空：

function isEmptyStr(s) { 
    if (s == null || s === '') { 
    return true } return false } // 或 function isEmptyStr(s) { 
    if (s == undefined || s === '') { 
    return true } return false } 

判断字符串不为空：

function isNotEmptyStr(s) { 
    if (typeof s == 'string' && s.length > 0) { 
    return true } return false } 

参考文献