JS基础语法-比较运算符隐式类型转换

最新推荐文章于 2024-07-11 20:55:36 发布

没资格抱怨

最新推荐文章于 2024-07-11 20:55:36 发布

阅读量79

点赞数 3

分类专栏： JS基础文章标签： javascript 开发语言

本文链接：https://blog.csdn.net/weixin_53541596/article/details/139548168

版权

JS基础专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<!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.隐式类型转换：
             1.转string ： + 字符串连接符
             2.转number： 自增自减 算术运算符 关系运算符（> < >= <= == != === !==）
             3.转boolean: ! 逻辑非

          2.面试题的一些坑：重新认识比较运算符 x==y
            a. 当x与y都为null或者undefined,   返回true
            b. 当x或y为NaN,返回false
            c. 当x或y都为：string，number，boolean。且数据类型不一致的时候，此时会隐式转换成number后比较
            d. 如果x或y存在对象类型，则会转为原始值后比较                      
                * 对象转原始值 : 先调用valueOf()方法获取原始值，然后调用toString()方法转为字符串
                    * valueOf() 默认返回自身
            e. x与y都为对象类型，则比较它们的引用地址。如果同一个地址则为true，不同地址则为false
        */

        //1.===： 全等运算符
        //严格匹配：值与数据类型必须要同时相等
        console.log(undefined === null);//false
        console.log("1" === 1);//false
        console.log([] === {});//false

        //2. x == y :相等运算符
        //不严格匹配：当左右两边数据类型不一致的时候允许进行隐式数据类型转换(有前提条件)

        //例如
        console.log(Number(null));//0
        console.log(Number(undefined));//NaN
        console.log(undefined == null);//true  此时没有进行数据类型转换

        //2.1  当x与y都为null或者undefined,   返回true
        console.log(null == null);//true
        console.log(undefined == undefined);//true
        console.log(null == undefined);//true

        console.log(undefined === null);//false

        //2.2  当x或y为NaN,返回false
        /* NaN与任何数字都不等 */
        console.log(NaN == undefined);//false
        console.log(NaN == null);//false
        console.log(NaN == NaN);//false

        //2.3   当x或y都为：string，number，boolean。且数据类型不一致的时候，此时会隐式转换成number后比较

        console.log(1 == "1");//true   1 == Number('1')
        console.log("0" == false);//true   Number('0') == Number(false)

        //2.4 如果x或y存在对象类型，则会转为原始值后比较
        //对象转原始值 : 先调用valueOf()方法获取原始值，然后调用toString()方法转为字符串

        console.log([1, 2, 3].valueOf());//[1, 2, 3]       数组调用valueOf方法默认情况下返回自身
        console.log([1, 2, 3].valueOf().toString());// 1,2,3
        console.log([1, 2, 3] == "1,2,3");//true

        //关于空对象与空数组的原始值
        console.log([].valueOf().toString());//''   空字符串
        console.log({}.valueOf().toString());//[object Object]   空字符串

        console.log([] == "");//true
        console.log({} == "[object Object]");//true

        /*以下是常见的面试坑*/
        console.log([] == 0);//true
        /*分析过程
        (1)  [].valueOf ().toString ()  == ''
        (2) '' == 0
         */
        console.log(![] == 0);//true
        /*分析过程：一元运算符优先级高于二元运算符
       ![] = false
       false == 0
         */

        console.log({} == 0);//false
        /*分析过程
       (1)  {}.valueOf ().toString ()  == '[object Object]'
       (2)  '[object Object]' == 0
        */
        console.log(!{} == 0);//true
        /*分析过程：一元运算符优先级高于二元运算符
       !{} = false
       false == 0
         */

        //2.5 x与y都为对象类型，则比较它们的引用地址。如果同一个地址则为true，不同地址则为false

        var arr1 = [1, 2, 3];
        var arr2 = arr1;
        console.log(arr2 == arr1);//true  地址一致
        var arr3 = [1, 2, 3];
        console.log(arr1 == arr3);//false  地址不一致

        /*以下为面试题的一些坑*/
        console.log({} == {});//false   同时声明两个空对象，堆中地址不同
        console.log([] == []);//false   同时声明两个空数组，堆中地址不同
        console.log(null == 0);//false  两个等号进行相等比较时  null不会转number，代表的是堆中的一个空地址（可以理解为堆地址的起点0x0000）
        console.log(null >= 0);//true   大小比较  null会转成number类型0
        console.log(null <= 0);//true    
    </script>
</body>

</html>