JavaScript数据类型转换

JavaScript数据类型转换有时候需要强制转换，有时候JavaScript会自己进行隐式转换，此时就得注意了。

1
'1' == 1 //true
2
'' == null //false
3
'' == 0 //true
4
[] == 0 //true
5
[] == '' //true
6
[] == ![] //true
7
null == undefined //true
8
Number(null) //0
9
Number('') //0
10
parseInt('') //NaN
11
{}+10 //10
12

13
let obj = {
14
  [Symbol.toPrimitive](){
15
    return 200
16
  },
17
  valueOf() {
18
    return 300
19
  },
20
  toString(){
21
    return 'Hello'
22
  }
23
}
24
console.log(obj+200) //400

强制类型转换#

强制类型转换方式包括Number()、parseInt()、parseFloat()、toString()、String()、Boolean(),这些方法都比较相似，就是通过自身的方法来进行数据类型的强制转换。

Number()强制转换#

布尔值，true转换为1，false转换为0
数字返回自身。
null返回0
undefined返回NaN
如果是字符串
- 如果字符串中只包含数字(或是0x/0X开头数字可以有正负)将其转换为十进制
- 如果字符串中包含有效的浮点格式，转化为浮点数
- 如果是空字符串，转换为0
- 如果不是以上的，返回NaN
如果是Symbol，抛出错误
如果是对象，并且部署了[Symbol.toPrimitive]，调用对象的valueOf()方法，然后根据前面的规则转换返回的值，如果转换的结果是NaN,那么调用对象的toString方法，再次按前面的顺序返回对应的值。

1
Number(true);        // 1
2
Number(false);       // 0
3
Number('0111');      //111
4
Number(null);        //0
5
Number('');          //0
6
Number('1a');        //NaN
7
Number(-0X11);       //-17
8
Number('0X11')       //17

Boolean()方法的强制转换规则#

undefined, null, false, ”, 0(+0,-0), NaN转换的是false，其他转换的都是true。

1
Boolean(0)          //false
2
Boolean(null)       //false
3
Boolean(undefined)  //false
4
Boolean(NaN)        //false
5
Boolean(1)          //true
6
Boolean(13)         //true
7
Boolean('a')       //true

parseInt()#

直接转换

1
parseInt("1234blue");   //returns   1234
2
parseInt("0xA");   //returns   10
3
parseInt("22.5");   //returns   22
4
parseInt("blue");   //returns   NaN

根据进制转换

1
parseInt("AF",   16);   //returns   175
2
parseInt("10",   2);   //returns   2
3
parseInt("10",   8);   //returns   8
4
parseInt("10",   10);   //returns   10

parseFloat()#

跟parseInt()基本一样，不过是转换浮点数，但是没有进制转换的功能

1
parseFloat("1234blue");   //returns   1234.0
2
parseFloat("0xA");   //returns   NaN
3
parseFloat("22.5");   //returns   22.5
4
parseFloat("22.34.5");   //returns   22.34
5
parseFloat("0908");   //returns   908
6
parseFloat("blue");   //returns   NaN

toString()#

对于原始类型，null转化成”null” , undefined转换成 “undefined”, true转换成“true”, false转化成“false”, 数字除了极大和极小的数字采用指数形式。

1
var a = 1.07*1000*1000*1000*1000*1000*1000*1000
2
a.toString()    //"1.07e21"
3
var b = 15
4
b.toString() //"15"

对普通对象来说，除非自行定义，否则toString()返回内部属性Class的值，如”[object Object]”

1
let a = {
2
 name:"a"
3
}
4
a.toString() //"[object Object]"

数组对象重写了toString方法，把每个位置的都转换成字符串然后用,拼接

1
var a = [1,2,3]
2
a.toString() //1,2,3

String()#

和toString()的转换基本上是一样的，只不过toString没办法直接转换原始类型，只能转换经过js包装的对象。

1
11.toString() //报错
2
String(11) //"11"

隐式类型转换#

通过逻辑运算符(&&，||，!)，运算符(+,-,*,/)，关系操作符(>,<,<=,>=)，相等运算符（==）或者if/while条件操作，如果遇到两个数据类型不同的情况，都会出现隐式转化。

`==`的隐式类型转换规则#

如果类型相同，无需进行转换
如果其中一个值是null或者undefined，那么另一个操作符必须也是null或者undefined，不然返回的就是false不是true
如果其中一个是Symbol类型，那么返回false
两个操作值如果一个为String类型一个为Number类型，那么会将String类型转换为Number类型
如果一个操作值是boolean，会被转换成number
如果一个操作值是object，另一个操作值是string/number/symbol，就会把object转换为原始类型再进行判断（调用object的valueOf/toString方法进行转换）

1
null == undefined       // true  规则2
2
null == 0               // false 规则2
3
'' == null              // false 规则2
4
'' == 0                 // true  规则4 字符串转隐式转换成Number之后再对比
5
'123' == 123            // true  规则4 字符串转隐式转换成Number之后再对比
6
0 == false              // true  e规则 布尔型隐式转换成Number之后再对比
7
1 == true               // true  e规则 布尔型隐式转换成Number之后再对比
8
var a = {
9
  value: 0,
10
  valueOf: function() {
11
    this.value++;
12
    return this.value;
13
  }
14
};
15
// 注意这里a又可以等于1、2、3
16
console.log(a == 1 && a == 2 && a ==3);  //true f规则 Object隐式转换
17
// 注：但是执行过3遍之后，再重新执行a==3或之前的数字就是false，因为value已经加上去了，这里需要注意一下