那些出乎意料的类型转换
- 2019 年 12 月 4 日
- 筆記
本文作者:IMWeb helinjiang 原文出处:IMWeb社区 未经同意,禁止转载
JavaScript是一门弱类型的语言,因此类型之间的转换会更频繁也更灵活。本文讨论了一些你倍感意外的类型转换,以及其他类型相关的话题。
1. "0" 转换成布尔值
var a = "0"; if (!a) { console.log("1"); } else { console.log("2"); }
上述结果是打印 1
还是 2
呢?答案是 2
。因为 "0"
是一个非空字符串,所有的非空字符串转换成 boolean 值之后,都为 true
,同理 "false" == true
。
0 == false
, "0" == true
,当我们这么单独拿出来时,你可能能够清楚这一点,但在实际中,我们可能会忽略了。比如下面的例子:
localStorage.setItem('testNum', 0); var testNum = localStorage.getItem('testNum'); console.log(testNum, typeof testNum); // 0 string if(!testNum){ console.log('testNum == false'); // 永远不会进入 } localStorage.setItem('testStr', '0'); var testStr = localStorage.getItem('testStr'); console.log(testStr, typeof testStr); // 0 string if(!testStr){ console.log('testStr == false'); // 永远不会进入 }
虽然你存储了一个 Number
数值在 testNum
中,但取出来之后却是 String
类型的值了,当你还未意识到这里的区别时,可能会很疑惑为什么你的 console.log
一直不输出。
2. 空字符串转换为数字和布尔值
字符串转换成数字和布尔值场景比较多,我们罗列一下:
字符串 |
转换成数字 |
转换成布尔值 |
---|---|---|
""(空字符串) |
0 |
false |
"1.2"(非空,数字) |
1.2 |
true |
"one1"(非空,手字符非数字) |
NaN |
true |
字符串转换成数字时,字符串中前后空格会被忽略,即
" " == 0
," 1.2 " == 1.2
," 1.2 0" != 1.2
。
空字符串转换成数字和布尔值,会相对特殊一些,需要关注。
3. 数组转换为字符串和数字
一般我们将数组转换成字符串的方式是使用 Array.prototype.join()
方法。我们说一下几个有趣的场景:
数组 |
转换成字符串 |
转换成数字 |
---|---|---|
[](任意数组) |
"" |
0 |
[9](1个数字元素) |
"9" |
9 |
['a','b'](其他数组) |
"a,b" |
NaN |
然后这么一些判断就出现了: [] == 0
,[9] == 9
,看起来好像没什么用,但可用来装x。
4. == 相等
==
操作符用于判断两边的值是否相等,JavaScript会将两边的值做一些类型转换。我们这里不讨论详细的转换规则,仅来看一个有趣的事:
已知"1" == 1
,且" 1 " == 1
,那么能够得出 "1" == " 1 "
的结论吗?很遗憾,不能!如果真有这种需要,请使用 ===
。
5. null
if (typeof obj === 'object'){ console.log(obj.xx); }
你以为判断了 obj
为对象了就可以了么? 有没有考虑 obj=null
的场景?