第22节：关系运算符

这个名字真的有十个字q
406 阅读1分钟

22.22.尚硅谷_JS基础_关系运算符

一、概念：

  • 通过关系运算符可以比较两个值之间的大小关系，
    • 如果关系成立它会返回true，如果关系不成立则返回false。

二、具体分类：

1、大于号（>）和大于等于号（>=）

大于号（>）

  1. 判断符号左侧的值是否大于右侧的值
  2. 如果关系成立，返回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>
        var a = 10 > 9//true
        console.log("a = "+ a)

        var a = 10 > 15//false
        console.log("a = "+ a)
        
        var a = 9 > 9//false
        console.log("a = "+ a)

        var a = 10 > 10//false
        console.log("a = "+ a)
    </script>
</head>
<body>
    
</body>
</html>

image-20211106173530821

大于等于号（>=）

  1. 判断符号左侧的值是否大于或等于右侧的值
<!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>
        var a = 10 >= 9//true
        console.log("a = "+ a)

        var a = 17 >= 15
        console.log("a = "+ a)
        
        var a = NaN >= 9
        console.log("a = "+ a)

        var a = 10 >= 100
        console.log("a = "+ a)
    </script>
</head>
<body>
    
</body>
</html>

image-20211108160030793

2、小于号（<）和小于等于号（<=）

自己参考大于号

3、非数制的情况下：

对于非数制进行比较时，会将其转换为数字然后再比较。

<!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 > true);

        console.log(1 >= true);

        console.log(1 > "0");

    </script>
</head>
<body>
    
</body>
</html>

image-20211108155630060

特殊情况：==任何值和NaN做任何比较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 > null);

        console.log(10 < null);

        console.log(10 <= null);

    </script>
</head>
<body>
    
</body>
</html>

image-20211108160127588

4、两边都是字符串：

  • 如果符号两侧的值都是==字符串==中，==不会将其转换为数字==进行比较，而会分别==比较字符串中字符的Unicode编码==。
<!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" < "5");//true

        console.log("11" < "5");//true

        console.log("a" > "b");//false

        // 比较两个字符串时，比较的是字符串的字符编码。
        console.log("a" < "b");//true
    </script>
</head>
<body>
    
</body>
</html>

image-20211108162120336

  • 比较字符编码时，==是一位一位进行比较。==
<!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("abc" < "b")//true
    </script>
</head>
<body>
    
</body>
</html>

image-20211108164500236

  • 如果两位一样，则比较下一位，可以借用它来对==英文==进行排序
  • 注意：比较中文的时候没有意义
<!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("bbc" < "b")//true

        //比较中文的时候没有意义
        console.log("我" > "你")

    </script>
</head>
<body>
    
</body>
</html>

image-20211108165934123

5、两个字符串型的数字：

  • 如果比较的两个字符串型的数字，可能会得到不可预测的结果。
  • 在比较连个字符串型的数字是，一定一定要转型。
<!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("11323456789" < "5")//true

        //注意：在比较连个字符串型的数字是，一定一定要转型。
        console.log("11323456789" < +"5")//true
    </script>
</head>
<body>
    
</body>
</html>

image-20211108170301082

avatar
文章
阅读
粉丝