JavaScript语法引用数据类型之类型转换

一、类型转换

1、基本介绍
在JS中，数据类型装换，通常都是强制数据类型转换。

2、强制类型转换
在很多语言中其实我们是会区分 类型转换 & 强制类型转换的；
类型转换发生在静态类型语言的编译阶段，
强制类型转换则发生在动态类型语言的运行时。

由于在javascript中，编译过程体现的不是很明显。所以我们一般都会认为javascript中只存在强制类型转换

强制类型转换分为显示强制类型转换&隐式强制类型转换

            <script type="text/javascript">
        var a = 42;
        var b = a + "";         //  隐式强制类型转换
        var c = String( a );    //  显式强制类型转换

        console.log(typeof b,typeof c);

        /*对变量 b 而言，强制类型转换是隐式的；由于 + 运算符的其中一个操作数是字符串，所以是字符串拼接操作，结果是数字 42
            被强制类型转换为相应的字符串 "42" 。
        而 String(a) 则是将 a 显式强制类型转换为字符串*/

    </script>

二、 转换规则

1、ToString
规范的 9.8 节中定义了抽象操作 ToString ，它负责处理非字符串到字符串的强制类型转换。

基本类型值的字符串化规则为：

null 转换为 "null" ，
undefined 转换为 "undefined" ， 
true 转换为 "true" ；false转换为 "false"
数字的字符串化则遵循通用规则

引用数据类型:

        ToPrimitive(tostring - valueof)   ——> ToNumber

<script type="text/javascript">
        /*
            基本类型值的字符串化规则为：
                null 转换为 "null"
                undefined 转换为 "undefined"
                true 转换为 "true" ;   false转换为"false"
                数字的字符串化则遵循通用规则
                    1 转换为 "1"  (当然可能会有指数的形式 1.07e21)
        */
        console.log(String(null),String(undefined),String(true),String(1))

    </script>

2、ToNumber

它负责处理非数字化为数字。
基本类型值的数字化规则为

    Null==>0  ; 
    undefined==>NaN
    Boolean：true==>1    false==>0
    字符串:就是把字符串两边的空白字符去掉，然后把两边的引号去掉，看它能否组成一个合法的数字。
        如果是，转化结果就是这个数字；否则，结果是NaN。
        当然也有例外，比如空白字符串转化为数字的结果是0。

引用数据类型

    ToPrimitive(valueof - tostring)    ——> ToNumber

代码示例：

<script type="text/javascript">
        /*
            Null==>0  ;  undefined==>NaN
            Boolean：true==>1    false==>0
            字符串
                就是把字符串两边的空白字符去掉，然后把两边的引号去掉，
                看它能否组成一个合法的数字。
                    如果是，转化结果就是这个数字；否则，结果是NaN。
                    当然也有例外，比如空白字符串转化为数字的结果是0。

        */
        console.log(Number(null),Number(undefined),Number(true),Number("123"))

    </script>

3、ToBoolean

它负责非布尔化为布尔
假值 —>false
真值 —> true

以下这些是假值：

                    undefined
                    null
                    false
                    +0 、 -0 和 NaN
                    ""

真值就是假值列表之外的值。

代码示例：

<script type="text/javascript">
        /*
            假值 --->false
            真值 ---> true

                以下这些是假值：
                    undefined
                    null
                    false
                    +0 、 -0 和 NaN
                    ""

                真值就是假值列表之外的值。


        */
        console.log(Boolean(null),Boolean(undefined),Boolean(false),Boolean(""))

    </script>

4、 ToPrimitive
检查该值是否有 valueOf() 方法。如果有并且返回基本类型值，就使用该值进
行强制类型转换。如果没有就使用 toString() 的返回值（如果存在）来进行强制类型转换。如果 valueOf() 和 toString() 均不返回基本类型值，会产生 TypeError 错误.。

代码示例：

<script type="text/javascript">
        /*
            数组
            日期
                检查该值是否有 valueOf() 方法。如果有并且返回基本类型值，就使用该值进
                行强制类型转换。如果没有就使用 toString() 的返回值（如果存在）来进行强制类型转换。
                如果 valueOf() 和 toString() 均不返回基本类型值，会产生 TypeError 错误
        */


        /*  数组
                数组的valueOf还是返回该数组

                语法:arr.toString()
                返回值:逗号连接的字符串
            日期
                语法:dateObj.valueOf()
                返回值:从1970年1月1日0时0分0秒（UTC，即协调世界时）到该日期的毫秒数。

                语法:dateObj.toString()
                返回值:返回一个美式英语日期格式的字符串
        */
    </script>

三、 显式强制类型转换

1、ToString

<script type="text/javascript">
        /*
            1.String()
            2.mun.toString()
                toString() 方法以指定的基数返回该对象的字符串表示。
                    数字--->字符串
                    布尔--->字符串
                    引用数据类型--->字符串
        */
        var a = null;
        var b = undefined;
        var c = true;
        var d = 123;

//      var ar = a.toString();
//      var br = b.toString();
        var cr = c.toString();
        var dr = d.toString();

//      console.log(ar,typeof ar);
//      console.log(br,typeof br);
        console.log(cr,typeof cr);
        console.log(dr,typeof dr);


        //引用数据类型
        var arr =[1,2,3];
        arr.valueOf=function(){
            return 11;
        }
        arr.toString=function(){
            return 22;
        }
        var arrR = String(arr);
        console.log(arrR,typeof arrR);




    </script>

2、ToNumber

<script type="text/javascript">
        /*
            1.Number()
            2.+
                在 JavaScript开源社区中，一元运算 + 被普遍认为是显式强制类型转换


            3.parseInt  parseFloat
                字符串 --> 数字
        */
        var a = null;
        var b = undefined;
        var c="JJJ";
        var d = true;



        var ar = +a;
        var br = +b;
        var cr = +c;
        var dr = +d;
        console.log(ar,typeof ar);
        console.log(br,typeof br);
        console.log(cr,typeof cr);
        console.log(dr,typeof dr);



        //引用数据类型
        var arr =[1,2,3];
        arr.valueOf=function(){
            return 1;
        }
        arr.toString=function(){
            return 2;
        }
        var arrR = +arr;
        console.log(arrR,typeof arrR);



    </script>

3、ToBoolean

<script type="text/javascript">
        /*
            1. Boolean()
            2. !/!!
        */
        var a = "";
        var b = 0;
        var c = null;
        var d =undefined;

        var ar = !!a; 
        var br = !!b; 
        var cr= !!c;
        var dr = !!d;

        console.log(ar,typeof ar);
        console.log(br,typeof br);
        console.log(cr,typeof cr);
        console.log(dr,typeof dr);


        //引用数据类型
        //只看真假值
        var arr =[1,2,3];
        var arrR = !![1,2,3];
        console.log(arrR,typeof arrR)

    </script>

四、隐式强制类型转换

1、加号+
如果某个操作数是字符串 + 将进行拼接操作 ；

<script type="text/javascript">
        //如果某个操作数是字符串  + 将进行拼接操作 
        //遇到对象 则ToPrimitive
        var a = "42";
        var b = "0";

        var c = 42;
        var d = 0;



        var arr1 = [1,2];
        var arr2 = [3,4];
        arr1.valueOf=function(){
            return {};
        }
        arr1.toString=function(){
            return 1;
        }

        arr2.valueOf=function(){
            return 2;
        }
        arr2.toString=function(){
            return 1;
        }

        console.log(a + b); // "420"
        console.log(c + d); // 42
        console.log(arr1 + arr2); // "1,23,4"


    </script>

注意事项：

    [] + {}; // "[object Object]"
    {} + []; // 0

表面上看 + 运算符根据第一个操作数（ [] 或 {} ）的不同会产生不同的结果，实则不然。
第一行代码中， {} 出现在 + 运算符表达式中，因此它被当作一个值（空对象）来处理。 [] 会被强制类型转换为"" ，而 {} 会被强制类型转换为 "[object Object]"

2、toBoolean

<script type="text/javascript">
        /*
            (1)  if (..) 语句中的条件判断表达式。
            (2)  for ( .. ; .. ; .. ) 语句中的条件判断表达式（第二个）。
            (3)  while (..) 和 do..while(..) 循环中的条件判断表达式。
            (4)  ? : 中的条件判断表达式。
            (5)  逻辑运算符 || （逻辑或）和 && （逻辑与）左边的操作数（作为条件判断表达式）

                a || b;
                  大致相当于 (roughly equivalent to):
                a ? a : b;

                a && b;
                  大致相当于 (roughly equivalent to):
                a ? b : a;
        */

    </script>

3、==&&===
==比较符在js中的规则：趋于数字化(不同数据类型之间的比较，排除掉obj与obj)
obj与obj之间的== 只比较栈中保存的地址值。

==操作符解析
首先把javascript中的数据类型分成两组：
1. String、Number、Boolean和Object(有)
2. Undefined和Null(无)
分析：

• 1与2之间的比较都为false
• Undefined和Null之间的比较为true
• NaN 不等于 NaN
• 引用数据类型做比较永远看地址值

<script type="text/javascript">
        function xfz(){
            this.toString=function(){
                return 0;
            }
        }

//      方法的重写
        Array.prototype.valueOf=function(){
            return new xfz();
        }

        Array.prototype.toString=function(){
            return 1;
        }

        var a=[""];
        console.log(a==false);

//      var cmd=new xfz();
//      console.log(cmd==false);
    </script>

速查表：