js之数据类型转换

47 篇文章 1 订阅

JS中的数据类型分为以下两种类型。

基本数据类型:数字 number,字符串 string,布尔 boolean,空 null,未定义 undefined
引用数据类型:

    对象 object:普通对象,数组对象 (Array),正则对象 (RegExp),日期对象 (Date),数学函数 (Math
    函数 function
真实项目中,根据需求,我们往往需要把数据类型之间进行转换,比较来进行相关操作。

一:转化为Number类型

需要转换数据的情况:

    1,isNaN(argument):当检测的数据不是数字类型的时候,会使用Number()将其转化成数字,然后再进行NaN检测。

    2,parseInt/parseFloat/Number():手动的将数据转化成数字类型。前两个分别是对数据进行解析转换,前者是整数,后者是浮点数。他们解析的原则是从前往后进行解析,尽其所能。若存在有能识别的数字就解析,如果第一位就不是数字则返回NaN.Number则是对整体进行判断,是数字返回数字,否则NaN.

    3,运算符操作:"+ - * / "在"+"的运算中,不仅仅会有数学的加法运算,还可能包括字符串拼接。

'2' - 1 =>2
//    Number('2') -> 2
//    2-1=2
'3px' - 1 => NaN
'3px' + 1 => '3px1'
let i = '0';
i=i+1;=> '01'
i+=1; => '01'
i++; => 1 //i++是单纯的数学运算,摒弃了字符串拼接

    4,在做 == 比较的时候,有可能把其他值转化成number类型。文章末尾会讲。

转换规律:Number()浏览器,自行转换都是基于这个方法的。

基本类型:
string:
    Number('') => 0,
    Number(' ') => 0,
    Number('\n') => 0 换行符
    Number('\t') => 0制表符
    Number('89') => 89 
    Number('89p') => NaN
布尔类型:
    Number(true) => 1
    Number(false) => 0
null:
    Number(null) => 0
undefined:
    Number(undefined) => NaN
引用类型的数据,在进行转化的时候,会先调用toString(),然后再Number();
object:
    Number({}) => NaN
        //({}).toString() => '[object Object]' => NaN
    Number([]) => 0
        //[].toString() => "" => 0
    Number([1]) => 1
    Number([1,2]) => NaN
        //[1,2].toString() => "1,2" => NaN

二:转化为字符串类型

需要转换的情况:

1,基于alert/confirm/prompt/document.write()等方法输出的时候,会把值默认转成字符串,然后在进行输出。

2,基于 "+"  进行字符串拼接的时候

3,把引用类型的数据转化成数字的时候,会首先转化成字符串,再转化成数字。

4,给队形设置属性名的时候,如果不是字符串,会首先转换乘字符串,然后在当做属性存到对象中(对象的属性,只能是数字或者字符串。在类数组中,属性就是数字,只有当属性名不是数字和字符串的时候,才会将该属性名转化成字符串再存到对象中)

5,手动调用toString/toFixed/join/String等方法的时候,也是转换成字符串

let arr = [1,3]
arr.toString() => "1,3"
Math.PI.toFixed(4) => "3.1416"
arr.join('-') => "1-3"
String(arr) => "1,3"

转化规律:

number类型:
    1 => '1'
布尔类型:
    String(true) => 'true'
    String(false) => 'false'
null:
    String(null) => 'null'
undefined:
    String(undefined) => 'undefined'
数组:
    String([]) => ''
    String([1]) => '1'
    String([1,3]) => "1,3"
对象:
    {"age":18} => '[object Object]'
    {} => '[object Object]'
    //不管是啥样的普通对象,最后结果都一样

三:转换成布尔类型

需要转换的情况:

1,基于!/!!/Boolean()等方法转换

2,条件判断中的条件都会转换成布尔类型。

if(n) {}
//把n的值转换成布尔然后再验证真假
if('3px' + 3) {}
//'3px3' => true => 执行

转换规律:只有  " 0/NaN/null/undefined/空字符串 "这五个字会转换成false,其余都是true

四:特殊情况

1,数学运算和字符串拼接符合  "+":当表达式中出现字符串,就是字符串拼接,否则就是数学运算。

1+true =>2 数学运算
'1'+true =>'1true' 字符串拼接

[12]+10 =>'1210' 虽然现在没看见字符串,但是引用类型转换为数字,首先会转换为字符串,所以变为了字符串拼接
({})+10 =>"[object Object]10"
[]+10 =>"10"

{}+10 =>10 这个和以上说的没有半毛钱关系,因为它根本就不是数学运算,也不是字符串拼接,它是两部分代码
  {} 代表一个代码块(块级作用域)
  +10 才是我们的操作
  严格写法:{}; +10;


思考题:
12+true+false+null+undefined+[]+'珠峰'+null+undefined+[]+true



=>'NaN珠峰nullundefinedtrue'

2,在进行 "==" 进行数据比较的时候,如果左右两边的数据类型不一样,则先转换成相同的数据类型再进行比较。

(1)不同数据情况下的比较,都是把其他数据类型的值,转换成数字再进行比较。

对象==数字:把对象转换为数字
对象==布尔:把对象转换为数字,把布尔也转换为数字
对象==字符串:把对象转换为数字,把字符串也转换为数字
字符串==数字:字符串转换为数字
字符串==布尔:都转换为数字
布尔==数字:把布尔转换为数字

(2)对象 ==  对象:不一定相等,因为对象操作的引用地址不一定相等。

{name:'xxx'}=={name:'xxx'} =>false
[]==[] =>false

var obj1={};
var obj2=obj1;
obj1==obj2 =>true

(3)特殊记忆的地方。

null==undefined:true
null===undefined:false
null&&undefined和其它值都不相等

NaN==NaN:false
NaN和谁都不相等包括自己

例子:

1==true =>true
1==false =>false
2==true =>false  规律不要混淆,这里是把true变为数字1


[]==true:false  都转换为数字 0==1
![]==true:false

[]==false:true  都转换为数字 0==0
![]==false:true  先算![],把数组转换为布尔取反=>false  =>false==false

 

 

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值