JavaScript的数据类型转换--显式转换

目录

一、将其他类型转为String类型

1.使用toString方法

2.在数据后面加 空字符串

3.使用String（）包装器

二、将其他类型转为Number类型

1.使用Number（）包装器

2.使用parseInt（）方法

3.使用parseFloat（）方法

4.使用+号运算符

三、将其他类型转为Boolean类型

1.使用Boolean包装器

2.使用！！ 双感叹号

总结：

---

接上文，我们介绍完了JavaScript的隐式转换，今天来讲讲它的显式转换，根据隐式转换的含义我们不难得出，JavaScript的显示转换，就是我们能在代码上看得见的转换，也就是我们自己设置的转换，比如说String类型的toString（）方法诸如此类，JavaScript的显式转换大致分为以下三类

一、将其他类型转为String类型

1.使用toString方法

var num = 123
var arr = [1,2,3]
var obj = {name:'zhangsan'}

console.log(typeof num.toString());//string

console.log(typeof arr.toString());//string

console.log(typeof obj.toString());//string

2.在数据后面加 空字符串

var num = 123
var arr = [1,2,3]
var obj = {name:'zhangsan'}

console.log(typeof (num + ''));//string

console.log(typeof (arr + ''));//string

console.log(typeof (obj + ''));//string



//注意:不要写成下面的样子 根据代码解析顺序 typeof判断的是num，arr，obj
console.log(typeof num + '');//number

console.log(typeof arr + '');//object

console.log(typeof obj + '');//object

3.使用String（）包装器

var num = 123
var arr = [1,2,3]
var obj = {name:'zhangsan'}

console.log(typeof String(num));//string

console.log(typeof String(arr));//string

console.log(typeof String(obj));//string

二、将其他类型转为Number类型

注：我们一般不会把引用数据类型转化为Number类型，因为那没有太大的意义

1.使用Number（）包装器

var num = 123
var str = '123'
var str2 = ''
var str3 = 'hjkash'
var arr = [1,2,3]
var obj = {name:'zhangsan'}

console.log(Number(num),typeof Number(num));//123  number
console.log(Number(str),typeof Number(str));//123  number
console.log(Number(str2),typeof Number(str2));//0  number

//非数字的字符串和引用数据类型转化成Number类型没有意义 转化后的结果都是非数字
console.log(Number(str3),typeof Number(str3));//NaN  number
console.log(Number(arr),typeof Number(arr));//NaN  number
console.log(Number(obj),typeof Number(obj));//NaN  number

console.log(Number(true),typeof Number(true));//1  number
console.log(Number(false),typeof Number(false));//0  number
console.log(Number(null),typeof Number(null));//0  number
console.log(Number(undefined),typeof Number(undefined));//NaN  number

2.使用parseInt（）方法

// 这里就不用typeof判断数据的类型了 如果想要看看是否转换为了Number类型 
// 在前面加typeof判断就好了


// 转换null undefined boolean
console.log(parseInt(null));//NaN 
console.log(parseInt(undefined));//NaN 
console.log(parseInt(true));//NaN 
console.log(parseInt(false));//NaN 

// 转换number
console.log(parseInt(10));//10 
console.log(parseInt(10.5));//10  如果是小数 舍去小数点一级后面的内容

// 转换string
console.log(parseInt("123"));//123  如果仅包含数值，转换为对应的数值
console.log(parseInt("234.1"));//234  小数点后面的数值省略
console.log(parseInt("+12.1"));//12  首位为符号位，其余为为数值，转换为整数
console.log(parseInt("1+2.7"));//1  符号位出现在其他位置，保留符号位前面的数值
console.log(parseInt("0xa"));//10  如果仅包含十六进制格式，转为为对应的十进制的值
console.log(parseInt("010"));//10  不会当做八进制被解析，结果为10
console.log(parseInt(""));//NaN  空字符串被转换为NaN
console.log(parseInt("123ac"));//123  如果首位为数值，依次向后解析，找到连续的数值，
//直到遇到第一个非数值的，将之前获取的数值转换为Number

3.使用parseFloat（）方法

// 转换null undefined boolean
console.log(parseFloat(null));//NaN 
console.log(parseFloat(undefined));//NaN 
console.log(parseFloat(true));//NaN 
console.log(parseFloat(false));//NaN 

// 转换
console.log(parseFloat(10));//10 
console.log(parseFloat(10.5));//10   如果是小数，保留小数点
console.log(parseFloat(10.0));//10   如果是10.0  结果为10

// 转换string
console.log(parseFloat("123"));//123  如果仅包含数值，转换为对应的数值
console.log(parseFloat("234.1"));//234.1  保留小数点后面的数值
console.log(parseFloat("+12.1"));//12.1  首位为符号位，其余为为数值，转换为整数
console.log(parseFloat("1+2.7"));//1  符号位出现在其他位置，保留符号位前面的数值
console.log(parseFloat("0xa"));//0  不会当做十六进制来解析
console.log(parseFloat("010"));//10  不会当做八进制被解析，结果为10
console.log(parseFloat(""));//NaN  空字符串被转换为NaN
console.log(parseFloat("123.3ac"));//123.3  如果首位为数值，依次向后解析
//找到连续的数值，直到遇到第一个非数值的，将之前获取的数值转换为Number

4.使用+号运算符

console.log(+'123');//123
console.log(+null);//0
console.log(+undefined);//NaN
console.log(+true);//1
console.log(+false);//0

console.log(+'123.s');//NaN

三、将其他类型转为Boolean类型

1.使用Boolean包装器

console.log(Boolean(123));//true
console.log(Boolean('123'));//true
console.log(Boolean('hello'));//true
console.log(Boolean(''));//false


console.log(Boolean(true));//true
console.log(Boolean(false));//false
console.log(Boolean(null));//false
console.log(Boolean(undefined));//false

2.使用！！ 双感叹号

console.log(!!123);//true
console.log(!!'123');//true
console.log(!!'hello');//true
console.log(!!'');//false


console.log(!!true);//true
console.log(!!false);//false
console.log(!!null);//false
console.log(!!undefined);//false

总结：

我们通过这些方法将数据转成我们需要的类型，这就是显式转换。这篇文章用了大量的基础代码来说明显式转换的各种方法，不用死记硬背，就是多敲多练，当你熟悉之后，你自己就会觉得自己转换数据的方法有些问题。感谢大家的阅读