1.显式数据类型转换
显式转换:程序员主动调用语法去转换数据类型,语义更加明确
- 注意:数据类型的转变并不会改变原来变量的值,而是会产生一个新的值
- 例如:(1) let num = '10';
- parseInt(num) :
- 为什么要有数据类型转换?
- 有时候想要进行某种计算的时候,由于数据类型不同往往会产生一些错误的结果,为了避免这种结果,我们需要将某种数据类型转化为其他数据类型
- 例如:prompt()输入框得到的数据的类型是string,如果想要进行数学计算则需要转成number类型,否则会计算出错
- 什么是显示类型转换:程序员主动转换(可以理解为使用关键字来转换)
- 这种方式代码易读性更高
1.其他类型转换成number类型
/**转换成number * 第一种方式:`parseInt()` * * 作用:转换整数 * * 从左往右解析,遇到非数字结束(停止解析),将解析好的整数返回 * * 如果第一个字符不是数字或者符号就返回NaN * 第二种方式:`parseFloat()` * * 作用:转换小数 * * 与parseInt()最大的区别就是可以解析字符串的第一个小数点 * 第三种方式: `Number()` * 作用:布尔类型转换成数字 * * 可以把任意值转换成数值,如果要转换的字符串只要有一个不是数字,返回NaN */ console.log ( Number ( "123" ) );//123 console.log ( Number ( "123.1.1abc" ) ); //NaN 只要有一个字符不是数字,得到就是NaN console.log ( parseInt ( "123.1.1abc" ) ); //123 从左往右解析,遇到非数字结束 console.log ( parseFloat ( "123.1.1abc" ) );//123.1 与parseInt唯一的区别就是可以识别第一个小数点 //一般数字字符串使用parseInt和parseFloat,其他数据类型转数字使用Number() console.log ( Number ( true ) ); //1布尔类型转换number会得到数字0(false)和1(true) console.log ( Number ( "" ) ); //0 空字符串转number会得到0 //js基础面试题 console.log(Number(undefined)); //NaN console.log(Number(null)); //0
2.其他类型转换成string类型
- 1.第一种方式:变量名.toString()
- 如果变量的值为undefined或者null,则会报错
- 2.第二种方式:String(变量名)
- 与第一种方式的唯一区别就是如果变量的值为undefined或者null不会报错,会得到undefined或者null
let a = null; //1.常用: String ( ) //特点:可以识别undefined与null console.log ( String ( null ) ); console.log ( typeof String ( a ) ); // //2. 变量名.toString () //特点:无法识别undefined与null,程序会报错 console.log ( a.toString () );
3.其他类型转换成boolean类型
只有一种方式: Boolean(变量名)
- 官网文档中有八种情况得到的false:0、-0、null、false、NaN、undefined、或者空字符串("")、 document.all()
- 其他一切均为true
console.log ( Boolean ( 0 ) ); //false console.log ( Boolean ( -0 ) ); //false console.log ( Boolean ( null ) ); //false console.log ( Boolean ( false ) ); //false console.log ( Boolean ( undefined ) ); //false console.log ( Boolean ( '' ) ); //false console.log ( Boolean ( NaN ) ); //false
2.隐式数据类型转换
隐式转换:运算符两边数据类型不一致,编译器自动帮我们转换一致在计算,这是js的语法特点
隐式转换
- 1.转成string类型:+号两边如果有一边是字符串,则会把另一边转换成字符串,然后进行拼接
- 2.转成number类型:以下几种运算符会将任何数据转换成number类型再运算,如果无法转换则为NaN
- 数学正号 : +num
- 当 +/-号写在一个变量名的前面,此时表示数学的正/负数
- 自增自减(++ --)
- 算术运算符(+ - * / %)
- 比较运算符(> < >= <= == != \=\=\= !==)
- 说明:全等与不全等会先比较值(此时会隐式转换再比较),然后再比较数据类型
- 3.转成boolean类型:逻辑非(!)会将任何数据转为boolean类型再运算
- 4.+号有三种含义:数学正负号(转成number)、算术运算符(转成number)、字符串连接符(转成string)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script> /* 1. 显式转换 : 程序员主动使用语法来转换(阅读性最高) 2. 隐式转换 : 如果运算符两边数据类型不一致,编译器偷偷的帮我们转成一致再计算。 (1)其他数据类型转number : 数学正号 : +num 自增自减: ++ -- 算术运算符: + - * / % 关系运算符 : > < >= <= (2)其他数据类型转string : + (3)其他数据类型转boolean : ! */ console.log('100' - 1); // Number('100') - 1 = 100 - 1 = 99 //1.其他数据类型转number : // 数学正号 : +num // 自增自减: ++ -- // 算术运算符: + - * / % console.log(+'10'); // Number('10') console.log('海海' - 100); // Number('海海') - 100 = NaN - 100 = NaN console.log(10 - '1'); // 10 - Number('1') = 10 - 1 = 9 //2. 其他数据类型转string : + console.log('1' + 1); //'1' + String(1) = '1' + '1' = '11' /* 注意点 : 算术运算符 + 转换规则 与 连接符 + 转换规则 */ console.log('1' + true); //1true 连接符 ‘1’ + String(true) = '1' + 'true' = '1true' console.log(1 + true); //2 算术运算符 1 + Number(true) = 1 + 1 = 2 console.log(1 + undefined); //NaN 算术 1 + Number(undefined) = 1 + NaN = NaN console.log(1 + null); //1 算术 1 + Number(null) = 1+ 0 = 1 console.log('1' + null); //1null 连接 '1' + String(null) = '1' + 'null' = '1null' //其他数据类型转boolean : ! //取反 : true变false false变true console.log(!1); //(1)!Boolean(1) = !true = false console.log(!!''); //(1)!!Boolean('') (2)!!false (3)!true = false </script> </body> </html>