【JavaScript 学以致用】值的判断以及类型转换

引言

来到北京已经有4个年头了，做过一些测试、打杂、前端的工作之后，最后还是选择了前端的工作。现阶段主要还是在写业务代码，代码质量，工作效率就显得尤为重要。【学以致用】这个系列主要记录一些平时工作、学习遇到的一些问题，方便以后查漏补缺。

value 显示强制类型转换

最新的 ECMAScript 标准定义了 7 种数据类型:

6 种原始类型:
- Boolean
- Null
- Undefined
- Number
- String
- Symbol (ECMAScript 6 新定义)

和

Object

通常我们在工作的时候需要和后台对接，函数在处理返回值的时候如果做了容错判断，把数据转换成我们想要的类型，在编写后续业务代码的时候就会更加轻松 :-D

下图是《JavaScript权威指南》中关于类型转换的总结：

《JavaScript权威指南》中关于类型转换的总结

举个栗子：后台返回值为一个字符串，内容是0 ~ 5的数字，现在使用的时候需要将参数转化为数字类型。

// wrong
return Number(value) 
// '' -> 0 
// undefined -> NaN
// 'aaa' -> NaN

// right 前面是剔除掉 '' undefined ，后面可以剔除掉 NaN 的类型
if (value && Number(value) >= 0) {
    return Number(value);
} else {
    return null; 
}

关于值的比较，当我们只关心值是否正常时，还有一个比较靠谱的方法：正则表达式，上面的例子也可以这样来写：

if (/[0-5]/.test(value)) {
    return Number(value);
} else {
    return null; 
}

小结：在判断两个值是否相等时，最好显式的转化，让代码更加清晰易读，然后用全等运算符 === 或者 !== 来比较。

隐式强制类型转换

隐式强制类型转换指的是一些特殊的操作的副作用来实现类型转换，而非 Number() 和 String() 等函数来实现值的类型转换。隐式强制类型转换通常会使代码更加简洁，但同时也增加了代码的理解难度，我们编写的代码大都是给别人看的，要考虑到大家的理解是否保持一致。

数字和字符串的转换，个人习惯是使用显示的转换，这里不再赘述。

ToBoolean

下面几种情况会发生布尔值的强制类型转换：

if (..) 语句中的天健判断表达式。
for (.. ; .. ; ..) 语句中的条件判断表达式。
while (..) 循环中的条件判断表达式。
? : 中的条件判断表达式
|| 和 && 的做操作数

而 switch 语句使用的是全等判断，不会发生隐式的强制转换。

转换的结果可以参照上面的表格，或者下面的链接👇：

js比较表：dorey.github.io/JavaS...

对象转换为原始值

所有对象会继承两个方法toString()和valueOf()。

对象转换为字符串 String(Object)
- 1、当对象具有toString()会优先调用；
- 2、如果没有toString()方法，或者toString()没有返回一个原始值，则会调用valueOf()方法；
- 3、无法从toString()和valueOf()获取原始值的时候，则会抛出一个类型错误异常。

String([1,2,3])  // "1,2,3"
String(function(x) {return x+1;})  // "function(x) {return x+1;}"
String("/\d+/g") // "/\d+/g"
String(new Date(2019,4,14)) // "Tue May 14 2019 00:00:00 GMT+0800 (中国标准时间)"

对象转换为数字 Number(Object)
- 1、当对象具有valueOf()会优先调用；
- 2、如果没有valueOf()方法，或者valueOf()没有返回一个原始值，则会调用toString()方法；
- 3、无法从toString()和valueOf()获取原始值的时候，则会抛出一个类型错误异常。

Number([1,2,3])  // NaN 原始类型
Number(function(x) {return x+1;})  // NaN
Number("/\d+/g") // NaN
Number(new Date(2019,4,14)) // 1557763200000

当判断两个数组是否相等时，可以简单的将其转换为 String 类型进行比较。
当判断两个对象是否相等时，就需要借助其他工具来完成了：lodash.com/docs/4.17..…

参考文章

JavaScript 权威指南 - 第3章：类型、值和变量
你不知道的 JavaScript 中卷，第4章：强制类型转换
JavaScript 数据类型和数据结构：developer.mozilla.org...