JS里的数据类型转换

首先我们知道JavaScript里的数据类型有：

number、boolean、string、null、undefined、symbol、object

1、转string

1.1 使用toString()

1.1.1 number

1
2
3

var a = 1
var b = a.toString()
console.log(b, typeof b)  //1 string

1.1.2 boolean

var a1 = true
var a2 = false
var b1 = a1.toString()
var b2 = a2.toString()
console.log(b1, typeof b1)  //true string
console.log(b2, typeof b2)  //false string

1.1.3 null、undefined

var a1 = null
var a2 = undefined
var b1 = a1.toString()
var b2 = a2.toString()
console.log(b1, typeof b1)  //报错
console.log(b2, typeof b2)  //报错

1.1.4 object

var a = {
  name: 'zww',
  age: 19
}
var b = a.toString()
console.log(b, typeof b)  //[object Object] string

上面代码中，虽然不会报错，但是结果不是我们所要的！

1.2 使用“ ‘’ ”和“ + ”

console.log(1 + '')  //"1"

console.log(true + '')  //"true"

var obj = {
  name: 'zww'
}
console.log(obj + '')  //"[object Object]"

console.log(null + '')  //"null"

console.log(undefined + '')  //"undefined"

在上面的代码中，“+”如果发现左边或右边任意一边有字符串，就会尝试把另外的一边也变为字符串。

1.3 使用String()

console.log(String(11))  //"11"

console.log(String({
  name: 'zww'
}))  //"[object Object]"

console.log(String(true))  //"true"

console.log(String(false))  //"false"

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

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

1.4 注意

使用toString方法不会影响到原变量，它会将转换的结果返回；
数值类型调用toString方法时，可以带一个参数，将输出对应进制的值；
null、undefined没有toString方法。如果需要转换，应该使用String()；
对于number、boolean类型，String()方法相当于调用了toString()方法。

2、转boolean

2.1 使用Boolean()

console.log(Boolean(1))  //true
console.log(Boolean('   '))  //true
console.log(Boolean('qqq'))  //true
console.log(Boolean({}))  //true

console.log(Boolean(0))  //false
console.log(Boolean(''))  //false
console.log(Boolean(null))  //false
console.log(Boolean(undefined))  //false
console.log(Boolean(NaN))  //false

2.2 使用!!

console.log(!!true)  //true
console.log(!!1)  //true
console.log(!!'  ')  //true
console.log(!!{})  //true
console.log(!![])  //true
console.log(!! function() {})  //true

console.log(!!null)  //false
console.log(!!undefined)  //false
console.log(!!NaN)  //false
console.log(!!0)  //false
console.log(!!'')  //false

2.3 注意

在所有值中只有六个值转为boolean是false：0、NaN、‘’（空字符串）、null、undefined、false。
所有对象都为true。

3、转number

3.1 使用Number()

3.1.1 string

如果是纯数字的字符串，则直接转换为数字

var a = '1234'
var b = Number(a)
console.log(b)  //1234
console.log(typeof b)  //number

如果字符串为空，或者是空格字符串，则转换为0

var a1 = ''
var a2 = '      '
var b1 = Number(a1)
var b2 = Number(a2)
console.log(b1, typeof b1)  //0 "number"
console.log(b2, typeof b2)  //0 "number"

如果字符串中有非数字的内容，转为NaN

var a = '1997zww'
var b = Number(a)
console.log(b)  //NaN
console.log(typeof b)  //number

3.1.2 boolean

var a1 = true
var a2 = false
var b1 = Number(a1)
var b2 = Number(a2)
console.log(b1, typeof b1)  //1 "number"
console.log(b2, typeof b2)  //0 "number"

3.1.3 null、undefined

var a1 = null
var a2 = undefined
var b1 = Number(a1)
var b2 = Number(a2)
console.log(b1, typeof b1)  //0 "number"
console.log(b2, typeof b2)  //NaN "number"

3.2 使用parseInt()

有两个参数，第一个参数是要转换的字符串，第二个参数是要转换的进制；
从第一位有效数字开始，直到遇到无效数字；
如果第一位不是有效数字，则直接返回NaN。

console.log(parseInt('10zww'))  //10

console.log(parseInt('20lq44'))  //20

console.log(parseInt('zww20'))  //NaN

console.log(parseInt(''))  //NaN

console.log(parseInt('011', 10))  //11

console.log(parseInt('011', 8))  //9

console.log(parseInt(false))  //NaN

console.log(parseInt(true))  //NaN

3.3 使用parseFloat()

不支持第二个参数，只能解析十进制数；
从第一位有效数字开始，直到遇到无效数字；
如果第一位不是有效数字，则直接返回NaN；
如果解析的内容只有整数，则只解析成整数。

console.log(parseFloat('12'))  //12

console.log(parseFloat('1.234'))  //1.234

console.log(parseFloat('1.234xx'))  //1.234

console.log(parseFloat('1.2.3xx'))  //1.2

console.log(parseFloat('zww111'))  //NaN

console.log(parseFloat(false))  //NaN

console.log(parseFloat(true))  //NaN

3.4 使用’ ‘ - 0

console.log('1.23' - 0)  //1.23

console.log('1.23rem' - 0)  //NaN

console.log('zww123' - 0)  //NaN

console.log(true - 0)  //1

console.log(false - 0)  //0

3.5 使用 + ‘ ‘

console.log(+'1.23')  //1.23

console.log(+'-1.23')  //-1.23

console.log(+'.1')  //0.1

console.log(+'12rem')  //NaN

console.log(+'re12m')  //NaN

console.log(+false)  //0

console.log(+true)  //1