JavaScript 中数据类型转换详解

1. 原始类型<=>原始类型（相互转换）

1.1 原始类型 =>字符串，直接加`""`

Boolean -> string : "true" or "false",
  
Number -> String: 
10.toString() = 10（默认以十进制为基）

基模式：
10.toString(2) = 1010
10.toString(8) = 12
10.toString(16) = A

1.2 原始类型 =>数字

Number(undefined)		// NaN
Number(null)			// 0
Number(true)			// 1
Number(false)			// 0
Number('123')			// 123
Number('1abc')			// NaN
Number('')				// 0

+undefined		// NaN
+null			// 0
+true			// 1
+false			// 0
+'123'			// 123
+'1abc'			// NaN
+''				// 0

ECMAScript 提供了两种把非数字的原始值转换成数字的方法，即 parseInt() 和 parseFloat()。只有对 String 类型调用这些方法，它们才能正确运行；对其他类型返回的都是 NaN。
parseInt()：把值转换成整数
parseFloat()：把值转换成浮点数

parseInt('12345red') = 12345
parseInt('AF', 16) = 175 // (基模式)

parseFloat()只能是十进制，不能有基模式，第一个出现的小数点是有效字符。如果有两个小数点，第二个小数点将被看作无效的。parseFloat() 会把这个小数点之前的字符转换成数字。

parseFloat("11.22.33")	// 11.22

使用 parseFloat() 方法的另一不同之处在于，字符串必须以十进制形式表示浮点数，而不是用八进制或十六进制。该方法会忽略前导 0，所以八进制数 0102 将被解析为102。对于十六进制数 0xA，该方法将返回 NaN，因为在浮点数中，x 不是有效字符。（注释：经测试，具体的浏览器实现会返回 0，而不是 NaN。）

1.3 原始类型 =>bool

只有6个值在进行bool类型转换的时候可以转换为false
这6个值为：undefined、null、 +0、-0、''、NaN

Boolean(undefined)		// false
Boolean(null)			// false
Boolean(+0)				// false
Boolean(-0)				// false
Boolean('')				// false
Boolean(NaN)			// false
Boolean({
    
    })				// true

1.4 强制类型转换（type casting）

使用强制类型转换可以访问特定的值，即使它是另一种类型的。

ECMAScript 中可用的 3 种强制类型转换如下：

Boolean(value) - 把给定的值转换成 Boolean 型；
Number(value) - 把给定的值转换成数字（可以是整数或浮点数）；
String(value) - 把给定的值转换成字符串；
强制转换成字符串和调用 toString() 方法的唯一不同之处在于，对 null 和 undefined 值强制类型转换可以生成字符串而不引发错误：
```
var s1 = String(null);     //"null"
var oNull = null;
var s2 = oNull.toString();      //会引发错误
```
用这三个函数之一转换值，将创建一个新值，存放由原始值直接转换成的值。这会造成意想不到的后果。

Number() 函数的强制类型转换与 parseInt() 和 parseFloat() 方法的处理方式相似，只是它转换的是整个值，而不是部分值。

扫描二维码关注公众号，回复： 11894408 查看本文章

parseInt() 和 parseFloat() 方法只转换第一个无效字符之前的字符串，因此 "1.2.3" 将分别被转换为 1 和 1.2。

用 Number() 进行强制类型转换，"1.2.3" 将返回 NaN，因为整个字符串值不能转换成数字。如果字符串值能被完整地转换，Number() 将判断是调用 parseInt() 方法还是 parseFloat() 方法。

2. 原始类型<=>对象

2.1 原始类型 =>对象

PS：只有null和undefined不能转换为对象（Object）

2.1.1 数字和bool =>对象

转换为object时为一个对象，对象的名字叫原始值

console.log(Object (true))  // [Boolean: true]
console.log(Object(3))      // [Number: 3]

2.1.2 字符串 =>对象

console.log(Object('abc'))      // [String: 'abc']

strign

2.1 对象 =>原始类型

基本情况

转换为布尔值
转换为数字
转换为字符串
转换为原始类型

对象在转换类型的时候，会执行原生方法 ToPrimitive 。
其算法如下：

如果已经是 原始类型，则返回当前值；
如果需要转 字符串 则先调用toSting方法，如果此时是 原始类型 则直接返回，否则再调用valueOf方法并返回结果；
如果不是 字符串，则先调用valueOf方法，如果此时是 原始类型 则直接返回，否则再调用toString方法并返回结果；
如果都没有 原始类型 返回，则抛出 TypeError 类型错误。

当然，我们可以通过重写Symbol.toPrimitive来制定转换规则，此方法在转原始类型时调用优先级最高。

const data = {
    
    
  valueOf() {
    
    
    return 1;
  },
  toString() {
    
    
    return "1";
  },
  [Symbol.toPrimitive]() {
    
    
    return 2;
  }
};
data + 1; // 3

2.1.1 对象 =>布尔值

undefined返回false。

console.log(Boolean(undefined))    // false

null返回 false。

console.log(Boolean(null))         // false

Boolean：返回当前参数。

console.log(Boolean(true))          // true
console.log(Boolean(false))          // false

Number：如果参数为+0、-0或NaN，则返回 false；其他情况则返回 true。

console.log(Boolean(+0))              // false
console.log(Boolean(-0))            // false
console.log(Boolean(NaN))            // false
console.log(Boolean(-1))              // true
console.log(Boolean(3))            // true

String：如果参数为空字符串，则返回 false；否则返回 true。

console.log(Boolean('abc'))         // true
console.log(Boolean(''))           // false

Symbol：返回 true。

console.log(Boolean({
    
    }))            // true

Object ：返回 true。

console.log(Boolean(Symbol(42)))   // true

2.2.2 对象 =>数字

undefined返回NaN。

console.log(Number(undefined))    // NaN

null返回 +0.

console.log(Number(null))    // +0

Boolean：如果参数为 true，则返回 1；false则返回 +0。

console.log(Number(true))    // 1
console.log(Number(false))    // +0

Number：返回当前参数。

String：先调用 ToPrimitive ，再调用 ToNumber ，然后返回结果。

console.log(Number(String('123')))    // 123
console.log(Number(String('abc')))    // NaN

Symbol：抛出 TypeError错误。

console.log(Number(Symbol(42)))    
// Uncaught TypeError: Cannot convert a Symbol value to a number

Object：先调用 ToPrimitive ，再调用 ToNumber ，然后返回结果。

console.log(Number({
    
    n: 2}))    // NaN

2.2.3 对象 =>字符串

undefined返回'undefined'。

console.log(String(undefined))    // 'undefined'

null返回 'null'

console.log(String(null))    // 'null'

Boolean：如果参数为 true ,则返回 “true”；否则返回 “false”。

console.log(String(true))    // 'true'
console.log(String(false))    // 'false'

Number：调用 NumberToString ，然后返回结果。

console.log(String(123))     // '123'
console.log(String(+0))    // '0'
console.log(String(NaN))     // 'NaN'
console.log(String(-1))    // '-1'

String：返回当前参数。

Symbol：抛出 TypeError错误。

console.log(String(Symbol(42)))    
// Uncaught TypeError: Cannot convert a Symbol value to a string

Object：先调用 ToPrimitive ，再调用 ToString ，然后返回结果。

console.log(String({
    
    n: 2})) // '[object Object]'