js类型转换

目录

一、基础类型转换

1、其他类型转换成boolean型

2、其他类型转换成字符串

3、其他类型转换成数字(可以是整数或者浮点数)

二、隐式类型转换

1、‘+’

2、数字-字符串(* / > <与‘-’类似)

3、有关‘==’的隐式转换

 4、引用类型的转换


1、数据类型

两种:基础类型 对象类型

基础类型/原始类型:Undefined、Null、String、Number、Boolean、Symbol

对象类型:function、object、array

一、基础类型转换

1、其他类型转换成boolean型

(1)Boolean() 包装器

Boolean('a') //true

(2)使用!!转换

!!'hello' //true 使用!!任意其他数据类型都可以转换为布尔类型。

2、其他类型转换成字符串

(1)toString()函数

var a = hello;
var b = 123;
console.log(a.toString(),typeof a.toString(),b.toString(),typeof b.toString());// 'hello' string '123' string

//变量为number类型时注意
var num = 10;
console.log(num.toString());  //"10" 默认以十进制格式返回数值
console.log(num.toString(2))	//"1010" 二进制格式
console.log(num.toString(8))	//"12" 八进制格式
console.log(num.toString(16))	//"a" 十六进制格式

除null、undefined,其他基本数据类型均有一个toString()函数。

(2) +'' :任意其他数据与''(字符串)相加都会转化为字符串

console.log(typeof (true/undefined/0/{}/... + ''));  //string

3、其他类型转换成数字(可以是整数或者浮点数)

(1)Number()包装器

转换的值是null,undefined,boolean,number时

Number(true); //1
Number(false); //0
Number(null); //0
Number(undefined); //NaN
Number(10); //10 是数字值,原样输出

 如果转换的值是String

Number("123"); //123  如果仅包含数值,转换为对应的数值
Number("234.1"); //234.1 解析为对应的小数 
Number("+12.1"); //12.1 首位为符号位,其余为为数值,转换为对应的数值 
Number("1+2.3"); // NaN 符号位出现在其他位置,解析为NaN 
Number("0xa"); //10 如果仅包含十六进制格式,转为为对应的十进制的值
Number("010"); //10【注意】不会当做八进制被解析,结果为10。 
Number(""); // 0 空字符串被转换为0 
Number("123ac"); // NaN 包含其他字符: NaN 
Number(12); //12

(2) parseInt()函数

如果转换的值数据类型是null,undefined,boolean,均转换为NaN

如果转换的值是number类型

parseInt(3); //3 整数值,原样输出 
parseInt(3.14); //3 小数,舍去小数点以及后面的所有内容

 如果转换的值是String类型

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

 (3)parseFloat()函数

如果转换的值是null,undefined,boolean,均转换为NaN

如果转换的值是Number

parseFloat(10); //10 
parseFloat(10.1); //10.1 小数,保留小数点
//如果是10.0结果为10

 如果转换的值是String

parseFloat("123"); //123
parseFloat("234.1"); //234.1 保留小数点后面的数值 
parseFloat("+12.1"); //12.1  首位为符号位,其余为为数值,转换为整数 
parseFloat("1+2.6"); //1  符号位出现在其他位置,保留符号位前的数值 
parseFloat("0xa"); //0; 【注意】不会当做十六进制来解析。区别parseInt("0xa")
parseFloat("010"); //10; 不会当做八进制被解析,结果为10
parseFloat(""); //NaN;空字符串被转换为NaN
parseFloat("123.3ac"); //123.3  首位为数值依次向后解析,直到遇到第一个非数值的,结果为此前的数值

 (4)+

+"23"         //23
+null         //0
+undefined    //NaN

二、隐式类型转换

1、‘+’

//字符串加字符串
var a = 'hello';
var b = 'world';
console.log(a + b); // helloworld
//字符串加数字
var a = b = '2';
var c = d = 3;
console.log(a + b + c + d);//2233 string
var a = b = '2';
var c = d = 3;
console.log(c + d + a + b );//622 string
结论:有两个或多个原始值,只要其中有一个是String类型,就把两个或多个原始值都进行转化字符串toString()操作,进行字符串拼接;否则把两个或多个原始值都进行转化数字toNumber()操作,进行数字相加。

2、数字-字符串(* / > <与‘-’类似)

var a = 10;
var b = '20'
var c = 'one'
var d = '10a'
console.log(a - b);  //-10
console.log(a - c);  //NaN
console.log(a - d);  //NaN

3、有关‘==’的隐式转换

(1)undefined == null;       //true

(2)字符串和数字比较

           ‘0’ == 0;      // true  字符串转数字后比较

(3)布尔类型和数字比较 

          0 == flase;      //true  布尔转数字后比较flase转为0,true转为1

(4)字符串和布尔类型比较

         ‘1’ == true;   //true   两者都要转为数字

 4、引用类型的转换

(1)PreferredType(期望转换的基本类型)被标记为Number

(2) PreferredType(期望转换的基本类型)被标记为String

 

注意: 如果对象为Date类型,则PreferredType被设置为String其他类型PreferredType被设置为Number

案例:

1. [] + []   // ""
console.log([] + [],typeof([] + []));//'' String
//PreferredType被设置为Number,先调用valueOf(),结果为[]不是原始值,所以继续调用toString(),结果是''(空字符串)是原始值,将''返回。第二个[]过程是相同的,返回''。加号两边结果都是String类型,所以进行字符串拼接,结果是''。

2. [] + {} // "[object Object]"
console.log([] + {},typeof([] + {}));//[object Object] string
//[]的结果是''。{}先调用valueOf(),结果还是{},继续调用toString(),结果是“[object Object]”,是原始值,将“[object Object]”返回,最后进行字符串拼接,结果是“[object Object]”。

3. {} + [] //浏览器运行结果0
console.log({} + [],typeof({} + []));//vscode终端运行结果[object Object] string
// 在浏览器中js解释器会将开头的{}看作一个代码块,原来{}+[]被解析成了{};+[],前面是一个空代码块被略过,剩下+[]就成了一元运算。[]转换后是'',将+''转化成Number结果是0。


4. {} + {} // 某些浏览器运行结果NaN
console.log({} + {},typeof({} + {}));//[object Object][object Object] string
//这里同第三个例子一样,{}+{}被解析成{};+{},空代码块忽略,剩下+{},转换后结果为NaN

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值