JS系列：js数据类型的转换

数据类型的转换

【基本数据类型】
数字 number
字符串 string
布尔 boolean
空 null
未定义 undefined
【引用数据类型】
对象 object
普通对象 {}
数组对象 []（Array）
正则对象（RegExp）
日期对象（Date）
数学函数（Math）
…
函数 function

真实项目中根据需求，我们徐亚进行对数据类型转换（规则和规则之间是相互独立的，千万不要混着记）

把其他数据类型转换为number类型

1.发生的情况
- isNaN检测的时候：当检测的值不是数字类型，浏览器会自己调用Number方法把它先转化为数字，然后再检测是否为非有效数字。

  例子1:isNaN('3') =>false
                Number('3') ->3
                   isNaN(3) ->false  是有效数字
  例子2：isNaN('3px') =>false
                Number('3px') ->NaN
                   isNaN(3) ->true   非有效数字

基于parseInt/parseFloat/Number 去手动转换为数字类型
数学运算：+ - * / %,但是"+"不仅是数学运算，也可能是字符串拼接

  '3'- 1 =>2
          Number('3')->3
          3-1->2

        '3px'- 1 =>NaN

        '3px'+ 1 =>'3px1' 字符串拼接

        var i='3';
        i=i++; =>  4  // i++就是单纯的数学运算，不是字符串拼接
        i=i+1; => '31'
        i+=1;  => '31'

在基于"=="比较的时候，有时候也会把其他的值转换为数字类型。
2.转换规律
转换的方法：Number （浏览器自行转换都是基于这个方法完成的）

【把字符串转换为数字】
只有遇到一个非有效数字字符，结果都是NaN
Number(’’) ->0
’ ’ ->0
‘\n’ ->0 // \n为换行符
‘\t’ ->0 // \t为制表符键盘也就是Tab，一个Tab就是4个空格键盘
【把布尔转换为数字】
true->1
false->0
【把没有转换为数字】
null ->0
undefined ->NaN
【把引用类型转换为数字】
首先先转换为字符串（toString），然后再转换为数字（Number）

把其他的值转化为字符串

1.发生的情况
- 基于alert/confirm/prompt/document.write 等方法输出内容的时候，会把输出的值转化为字符串，然后输出。

  alert(1)=>'1'

基于’+'进行字符串拼接的时候
把引用值转换为数字的时候，首先为转换为字符串，然后再转换为数字，
对对象设置属性名，如果不是字符串，首先转换为字符串，然后再当做属性存储到对象中（对象的属性只能是数字或者字符串）
手动调用toString/toFixed/Join/String等方法的时候，也是为了转换为字符串

   var m = Math.PI //=>获取圆周率
        m.toFixed(2)   => '3.14'

        var ary = [12,34,23];
        ary.join('+')  = '12+34+23'

2.转换规律

//=>调用的方法：toString

            1 -> '1'
            [] -> ''
            [12] -> '12'
            [12,23] -> '12,23'
                
      (function(){}).toString() =>"function(){}"
            new Date().toString()  =>"Mon Dec 09 2019 15:13:53 GMT+0800 (中国标准时间)"
             ...
            【对象】
            {name:'xxx'} -> '[object Object]'
            {} -> '[object Object]'
            不管是啥样的普通对象，最后结果都是一样的。

把其他的值转换为布尔类型

1.发生的情况
- 基于!/!!/Boolean等方法转换
- 条件判断中的条件最后都会转换为布尔类型

 if(n){
             //=>把n的值转换为布尔验证条件真假
         }
         if('3px'+3){
             //=>先计算表达式的结果'3px3',把结果转换为布尔true，条件成立。
         } alert(1)=>'1'

2.转换规律
只有"0/NaN/null/undefined/'' "五个值转换为布尔的false，其余为true

特殊情况：数学运算与字符串拼接 “+”

   //=>当表达式中出现字符串，就是字符串拼接，否则就是数学运算
        1+true => 2 不是字符串当做数学运算，true变成1，所以为2
        '1' + true => '1true' 字符串拼接
     
        [12]+10 =>'1210' 虽然现在没看到字符串，但是引用类型转换为数字，首先会转换为字符串，所以会变成了字符串拼接
        ({})+10 =>"[object Object]10"
        []+10="10"

        {}+10 =>10 这个和以上说的没有任何关系，因为不是数学运算，也不是字符串拼接，它是两部分代码
        {} 代表一个代码块（块级作用域）
        +10 才是我们的操作
        严格写法：{}; +10
        function fn(); + 10 =>10

思考题：

 12+true+false+null+underfined+[]+'前端'+null+underfined+[]+true =>"NaN前端nullundefinedtrue"
        解析：
        12+true =>13
        13+false =>13
        13+null =>13
        13+undefined =>NaN
        NaN+[] =>'NaN'
        'NaN'+'前端' =>'NaN前端'
        ...
        'NaN前端trueundefined'+[] =>'NaN前端trueundefined'
        ...
        =>'NaN前端trueundefined'

特殊情况："=="在进行比较时候，如果左右两边的数据类型不一样，则先转换为相同的类型，在进行比较

对象==对象：不一定相等，因为对象操作的是引用地址，地址不相同，则不相等
```
   {name:'xxx'} == {name:'xxx'} =>false
   []==[] =>false

   var obj1={};
   var obj2=obj1;
   obj1==obj2 =>true
```
对象数字：把对象转换为数字
对象布尔：把对象转换为数字，把布尔也转换为数字
对象字符串：把对象转换为数字，把字符串转换为数字
字符串数字：字符串转换为数字
字符串布尔：都转换为数字
布尔数字：布尔转换为数字
=====================>不同情况的比较，都是把其他的值转换为数字，然后再进行比较
nullundefined: true
nulll=undefined:false
null&undefined和其他值都不相等

NaN==NaN:false
NaN和谁都不相等包括自己
=============================>以上都需要特殊记忆
```
   1==true =>true
   1==false =>false
   2==true =>false 规律不要混淆，这里是把true变为数字1

   []==[] =>false
   ![]==[] =>true
   []==false => true //转换为数字都为0
   []==true => false //[]转换为数字都为0,true转换为数字都为1

   ![]==false =>true   先算![],把数组转换为布尔取反=>false =>false==false
   ![]==true =>false //true为1 ，![]为0
```

来源：CSDN

作者：公子清

链接：https://blog.csdn.net/Josiah_Yuan/article/details/103463949

标签

布尔类型

js代码

字符串函数

数字转换