本文深入讲解JavaScript中的数据类型转换，包括自动转换与强制转换的原理和应用。详细介绍了布尔、字符串、数值类型的转换规则，以及如何使用Number(), String(), Boolean()等函数进行类型强制转换。
数据类型的转化
在 JavaScript 程序中 , 变量中存储的数据类型没有限制
所谓的数据类型转化,就是将当前数据类型转化为其他数据类型
JavaScript中数据类型的转化,分为自动转化和强制转化
JavaScript中数据类型的自动转化
1.其他数据类型,自动转化为布尔类型
在 执行 if 判断时 ,其他数据类型会自动转化为布尔类型
0 '''' undefined null NaN 这五种情况转化为false
if(0){
console.log( '转化为true' );
}else{
// 0 转化为布尔类型false,执行else语句 输出结果 ==> false
console.log( '转化为false' );
}
if(""){
console.log( '转化为true' );
}else{
// "" 转化为布尔类型false,执行else语句 输出结果 ==> false
console.log( '转化为false' );
}
if(undefined){
console.log( '转化为true' );
}else{
// undefined 转化为布尔类型false,执行else语句 输出结果 ==> false
console.log( '转化为false' );
}
if(NaN){
console.log( '转化为true' );
}else{
// NaN 转化为布尔类型false,执行else语句 输出结果 ==> false
console.log( '转化为false' );
}
其他情况的数据类型转化为true
if(111){
// 数值类型111 转化为布尔类型true,执行if语句 输出结果 ==> true
console.log( '转化为true' );
}else{
console.log( '转化为false' );
}
if("你好!"){
// 字符串类型 "你好!" 转化为布尔类型true,执行if语句 输出结果 ==> true
console.log( '转化为true' );
}else{
console.log( '转化为false' );
2.其他数据类型,自动转化为字符串
字符串类型与其他任意类型之间相加都是拼接，数值之间正常计算。
console.log('我是字符串' + true;); // 布尔值 true转化为字符串'true' 输出结果 ==> 我是字符串true
console.log('我是字符串' + undefined);// undefined会转化为字符串'undefined' 输出结果 ==> 我是字符串undefined
console.log('我是字符串' + {name:'张三' , age:20 , sex:'男'});// 将对象、内容转化为 [object Object] 输出结果 ==> 我是字符串[object Object]
console.log('我是字符串' + [1,2,3,4,5]);// 将[]中的内容转化为字符串'1,2,3,4,5' 输出结果 ==> 我是字符串1,2,3,4,5
console.log('我是字符串' + function fun(){console.log(123)});//将所有函数的代码,都转化为字符串'function fun(){console.log(123)' 输出结果 ==> 我是字符串function fun(){console.log(123) console.log('111' + 100;); // 数值100转化为字符串'100' 输出结果 ==> 111100
console.log('abc' + 2e3 + 1);// 科学技术法 2e3会解析出结果转化为字符串2000, 输出结果 ==> abc2001
3.其他数据类型,自动转化为数值
如果是 + 加号所有的类型执行的是字符串拼接效果，所以使用减法运算实现效果
console.log(10 + [1,2,3,4]) // 这里是数组类型自动转化为数值类型1,2,3,4 输出结果 ==> 101,2,3,4
字符串类型:
console.log(1 - "字符串") // 这里是字符串类型 "字符串" 自动转化为数值类型 NaN 输出结果 ==> NaN
console.log(1 - "2e3") // 这里是科学计数法"2e3"自动转化为数值类型并解析出结果2000 输出结果 ==> -1999
console.log(1 - null) // 这里是null自动转化为数值类型 0 输出结果 ==> 1
布尔类型：
console.log(1 - true - false) // 这里是布尔类型自动转化为数值类型 true ---> 1 false ---> 0 输出结果 ==> 0
undefined、数组、对象、函数执行结果都是 NaN
console.log(1 - undefined) // 这里是undefined自动转化为数值类型 NaN 输出结果 ==> NaN
console.log(1 - [1,2,3,4]) // 这里是数组类型自动转化为数值类型NaN 输出结果 ==> NaN
console.log(1 - {name:"小明"}) // 这里是对象类型自动转化为数值类型NaN 输出结果 ==> NaN
console.log(1 - function fun(){console.log(123)}) // 这里是函数类型自动转化为数值类型NaN 输出结果 ==> NaN
JavaScript中数据类型的强制转化
1.其他数据类型,强制转化为布尔类型
Boolean( 数据/变量 )转化原则与自动转化原则相同
0 '''' undefined null NaN 都转化为false
console.log(Boolean(0)) // 0 强制转化为布尔类型false 输出结果 ==> false
console.log(Boolean("")) // "" 强制转化为布尔类型false 输出结果 ==> false
console.log(Boolean(undefined)) // undefined强制转化为布尔类型false 输出结果 ==>false
console.log(Boolean(null)) // null强制转化为布尔类型false 输出结果 ==> false
console.log(Boolean(NaN)) // NaN 强制转化为布尔类型false 输出结果 ==>false
其他数据类型,都转化为true
console.log(Boolean(111)) // 数值111 强制转化为布尔类型true 输出结果 ==> true
console.log(Boolean("你好！"))// 字符串 "你好！" 强制转化为布尔类型true 输出结果==> true
console.log(Boolean([1,2,3]))// 数组 [1,2,3] 强制转化为布尔类型true 输出结果==> true
Boolean() 这个方法不会改变变量中存储的原始数值，只是将变量中的数值,解析获取,再转化输出,不会改变变量中存储的内容
var int = 100;
console.log(Boolean(int)); //将 int 中存储的数值100 ,转化为布尔值true 输出结果==> true
console.log( int ); // 不会改变变量中存储的数值 输出结果==> 100
2.其他数据类型强制转化为字符串类型
方法1 变量.toString(进制类型，范围是 2 - 36 进制(10个数值+26个英文字母))
.toString()之前,不能直接写数值,必须是写成变量的形式
var int = 100;
console.log(int.toString(2)); // 二进制 输出结果==> 1100100（字符串形式）
console.log(int.toString(8)); // 八进制 输出结果==> 144（字符串形式）
console.log(int.toString(16));// 十六进制 输出结果==> 64（字符串形式）
console.log(int.toString()); // ()中没有输入,默认执行十进制 输出结果==> 100（字符串形式）
方法2 String( 变量 / 数据 )
将变量或者数据转化为字符串，不会改变变量中存储的原始数值
var d =true + 111;
console.log(String(d)) // 会将数值类型自动转化为字符串 输出结果==> 112（字符串形式）
console.log( d ); // 会将数值类型自动转化为字符串 输出结果==> 112（数值形式）
布尔类型、数值类型、undefined、null、数组、函数类型强制转化为字符串类型，都是他本身的字符串
console.log(String(true) ) // 这里是布尔类型 true强制转化字符串类型 true 输出结果 ==> true（字符串形式）
console.log(String(100) )// 这里是数值类型-整数强制转化字符串类型 100 输出结果==> 100（字符串形式）
console.log(String(undefined) )// 这里是undefined强制转化字符串类型 undefined 输出结果==> undefined（字符串形式）
console.log(String([1,2,3,4]) )// 这里是数组强制转化字符串类型1,2,3,4 输出结果==> 1,2,3,4（字符串形式）
console.log(String(function fun(){console.log(123)}) )// 这里是对象强制转化字符串类型function fun(){console.log(123)} 输出结果==> function fun(){console.log(123)} （字符串形式）
对象类型：
console.log(String({name:"小明"}) )// 这里是对象强制转化字符串类型[object Object] 输出结果==> [object Object]（字符串形式）
3.其他数据类型强制转化为数值类型
方法1 , Number(变量/数值)
布尔类型：
console.log(Number(true) ) // 这里是布尔类型 true强制转化数值类型 1 输出结果 ==> 1
console.log(Number(false) )// 这里是布尔类型 false强制转化数值类型 0 输出结果 ==> 0
字符串类型：
如果整个字符串,是纯数字字符串,或者符合科学计数法 ---> 转化为对应的数值
console.log(Number("100") )// 这里是字符串类型强制转化数值类型 100 输出结果 ==> 100
console.log(Number("2e3") )// 这里是字符串类型科学计数法2e3解析出结果，强制转化数值类型 2000 输出结果 ==> 2000
其他数据类型 ==> NaN
console.log(Number(235hjk) )// 这里是不符合数字的字符串类型强制转化数值类型NaN 输出结果 ==> NaN
console.log(Number(undefined) )// 这里是undefined强制转化数值类型NaN 输出结果 ==> NaN
console.log(Number([1,2,3,4]) )// 这里是数组强制转化数值类型NaN 输出结果 ==> NaN
Console.log(Number({name:"小明"}) )// 这里是对象强制转化数值类型NaN 输出结果 ==> NaN
console.log(Number(function fun(){console.log(123)}) )// 这里是对象强制转化字符串类型NaN 输出结果 ==> NaN
方法2 , parseInt(变量 / 数据)
是获取变量或者数据的整数部分，从数据的左侧起解析获取整数内容
布尔类型、undefined、null、对象、函数 ==> NaN
console.log(parseInt(true)) // 这里是布尔类型强制转化为数值类型 输出结果 ==> NaN
console.log(parseInt(undefined)) // 这里是undefined强制转化为数值类型 输出结果 ==> NaN
console.log(parseInt({name:"小明"})) // 这里是对象类型强制转化为数值类型 输出结果 ==> NaN
console.log(parseInt(function fun(){console.log(123)})) // 这里是函数类型强制转化为数值类型 输出结果 ==> NaN
数组类型：
获取数值部分( [] 的内部数值)
获取第一个数值的整数部分,如果有就获取如果没有,结果是NaN
console.log(parseInt([1,2,3,4])) // 这里是数组类型强制转化为数值类型 输出结果 ==> 1
console.log(parseInt(["我不是数值",2,3,4])) // 这里是数组类型强制转化为数值类型 输出结果 ==> NaN
数值类型：
如果是整数就直接获取；如果是浮点数或者科学计数法,就获取整数部分
console.log(parseInt(100)) // 这里是整数类型强制转化为数值类型 输出结果 ==> 100
console.log(parseInt(123.242)) // 这里是浮点数类型强制转化为数值类型 输出结果 ==> 123
console.log(parseInt(2e3)) // 这里是科学计数法强制转化为数值类型 输出结果 ==> 2000
字符串类型：
如果是有数字的字符串,取字符串中数字的整数部分（整数,是正常获取）
科学计数法，获取 e字符串之前的整数部分
带有不符合数值规范的内容,获取从左侧起,符合整数规范的部分,从左侧开始找整数部分，如果第一个不是数字直接输出 NaN
console.log(parseInt("字符串")) // 这里是字符串类型强制转化为数值类型 输出结果 ==> NaN
console.log(parseInt("2222")) // 这里是纯数字字符串类型强制转化为数值类型 输出结果 ==> 2222
console.log(parseInt("2.345")) // 这里是浮点数字类型强制转化为数值类型 输出结果 ==> 2
console.log(parseInt("2e2")) // 这里是科学技术字符串类型强制转化为数值类型 输出结果 ==> 2
console.log(parseInt("223jkm")) // 这里是不规则字符串类型强制转化为数值类型 输出结果 ==> 223
方法3 , parseFloat( 变量 / 数值 )
获取浮点数部分，从数据的左侧起 获取数据的浮点数部分
布尔类型、null、undefined、对象、函数与parseInt语法原则相同 结果 ==> NaN
字符串类型：
如果是纯数字的字符串，整数,浮点数,都会完整获取
如果是科学计数法，会解析出结果后完整获取
如果是不规则字符串数字类型，获取从左侧起,符合整数规范的部分,从左侧开始找整数部分
console.log( parseFloat( '100' ) );// 这里是纯数字字符串类型强制转化为数值类型 输出结果==> 100
console.log( parseFloat( '3.123' ) ); // 这里是浮点数字字符串类型强制转化为数值类型 输出结果==> 3.123
console.log( parseFloat( '3.123456e3' ) );// 这里是科学技术法浮点数字字符串类型会解析出结果后强制转化为数值类型 输出结果==> 3123.456
console.log( parseFloat( '3.456abc' ) ); // 这里是不规则字符串类型强制转化为数值类型 输出结果==>3.456
扫一扫
1130
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
