第24节:相等运算符

263 阅读1分钟

相等运算符:(可以把Boolean、string转换为number)

一、相等

1、(符号: ==)

  • 相等运算符用来比较连个值是否相等
    • 如果相等会返回true,否则返回false。
  • 使用 (符号: ==)来做相等运算。
    • 当使用 == 来比较
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log(1 == 1);//true

        var a = 10 ;
        console.log(a == 4)//false

        console.log("1" == 1)//true

        console.log(true == "1");//true

        //注意:是把string、Boolean转换为number,而不是number 转化为number
        console.log(null == 0);//false
    </script>
</head>
<body>
    
</body>
</html>

image-20211108175226310

2、undefined 衍生自 null

  • 所以这两个值==做相等判断==时,会返回true。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // undefined 衍生自 null
        // 所以这两个值做相等判断时,会返回true。

        console.log(undefined == null);//true        
    </script>
</head>
<body>
    
</body>
</html>

image-20211108175731454

3、NaN的特性:

  • ==NaN不和任何值相等,包括它本身==
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // NaN不和任何值相等,包括它本身
        console.log(NaN == undefined);

        console.log(NaN == NaN);
    </script>
</head>
<body>
    
</body>
</html>

image-20211108180503031

判断一个值是否为NaN:

  • 可以通过 isNaN()函数来判断一个值是否是 NaN
  • 如果该值是 NaN 则返回true,否则返回 false;

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // 可以通过 isNaN()函数来判断一个值是否是 NaN
        //     如果该值是 NaN 则返回true,否则返回 false;
        var b = NaN;
        console.log(isNaN(b))
    </script>
</head>
<body>
    
</body>
</html>

image-20211108181524954

二、不相等(符号 : != )

  • 不相等用来判断两个值是否不相等,如果不相等返回true,否则返回false。
    • 使用 != 来做不相等运算
  • ==不相等也会对变量进行自动的类型转换==,如果转换后相等它也会返回false
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log( 10 != 5)//true

        console.log(10 != 10)//false

        console.log("abcd" != "abcd")//false

        console.log("abcd" != "abd")//true
//不相等也会对变量进行自动的类型转换,如果转换后相等它也会返回false
        console.log("1" != 1)//false
    </script>
</head>
<body>
    
</body>
</html>

image-20211108182353972

三、全等(符号: ===)

  • 用来判断两个值是否全等,它和相等类似,不同的是它,不会做自动类型转换
    • ==如果两个值不同,直接返回false==
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log("123" == 123);//true

        console.log("123" === 123);//false
// null 和 undefined 在全等和相等的区别
        console.log(null == undefined);//true
        console.log(null === undefined)//false
    </script>
</head>
<body>
    
</body>
</html>

image-20211108183421769

四、不全等(符号: !==)

  • 用来判断两个值是否不全等,和不等类似,不同的是它不会做自动的类型转换。
    • ==如果两个值得类型不同,直接返回true==
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log("123" != 123);//true

        console.log("123" !== 123);//false
// null 和 undefined 在不等和不全等的区别
        console.log(null != undefined);//true
        console.log(null !== undefined)//false
    </script>
</head>
<body>
    
</body>
</html>

image-20211108183744765