js（运算符） day3

[再相见]

已于 2024-07-20 09:34:03 修改

阅读量169

点赞数 1

文章标签： javascript 前端开发语言

于 2024-07-20 09:19:56 首次发布

本文链接：https://blog.csdn.net/2301_76784404/article/details/140565598

版权

算数运算符

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>

    </style>
</head>

<body>
    <script>
        var num1 = 10;
        var num2 = 15;
        console.log(num1 + num2);
        console.log(num1 - num2);
        console.log(num1 * num2);
        console.log(num1 / num2);

        var str1 = "15";
        var str2 = "20";
        console.log(str1 + str2); // 1520
        console.log(str1 - str2); // -5
        console.log(str1 * str2); //300
        console.log(str1 / str2); //0.75

        console.log(str1 + num2); // 1515
        console.log(num2 + str1); // 1515
        // +  加法运算  拼接  因为+号两边有字符串，所以会出现拼接



        // 取余数  %   如果余数为0 表示可以被整除
        console.log(15 % 6);


        console.log((1 + 2 + 3) * 5 / (1 + 6) - 8);

        // 1.先算括号里面的 
        // 2.再算乘除
        // 3.最后算加减

        console.log(0.5 + 0.5);
        console.log(0.1 + 0.2);
    </script>
</body>

</html>

赋值运算符

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>

    </style>
</head>

<body>
    <script>
        // 赋值运算符  =
        // 将等号右边的值赋予给等号左边的变量
        var num = 10;
        // var num1 = num;

        // 等号右边的num表示的是num的值，等号左边的num表示的是num的变量
        num = num + 5
        num = num - 5
        num = num * 5
        num = num / 5

        // 简写
        num += 5;
        num -= 5;
        num *= 5;
        num /= 5;
    </script>
</body>

</html>

自增自减运算符

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>

    </style>
</head>

<body>
    <script>
        var num = 99;

        num += 1;
        num++;
        ++num;
        // 表示 num 自我增加1

        num--;
        --num;
        // 表示 num 自我减少1

        // 符号 在前 和 在后 效果是不一样的
        // 符号如果在变量的后面表示 先将变量拿来使用 之后在自增
        console.log(num++ + 1); // 100

        // 符号 在前 和 在后 效果是不一样的
        // 符号如果在变量的前面表示 先将变量自增 然后在拿去使用
        // console.log(++num + 1); // 101


        var a = 6;
        var b = 2;
        var c = a++ - --b + ++a - 5 - --b + a++;

        // console.log("a的值是：" + a); // 9  
        // console.log("b的值是：" + b); // 0  
        // console.log("c的值是：" + c); // 16 

        var d = --a * b++ - c++ + a-- - b * --b + c-- * 2;


        console.log("a的值是：" + a); // 7 
        console.log("b的值是：" + b); // 0
        console.log("c的值是：" + c); // 16 
        console.log("d的值是：" + d); // 26
    </script>
</body>

</html>

逻辑运算符

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>

    </style>
</head>

<body>
    <script>
        // 逻辑运算符  
        // 与  和 且   &&
        // 两个条件只要有一个不满足 最终的结果就是不成立  只有所有都成立 最终的结果才是成立
        // 如果第一个条件 成立 那么会直接输出第二个条件   
        // 如果第一个条件不成立 那么就会直接输出第一个条件
        console.log(true && false); // false
        console.log(true && true); // true
        console.log(false && false); // false

        console.log(1 && 0); //0
        console.log(0 && ''); //0


        // 或  或者 ||
        // 两个条件只要有一个成立 最终的结果就是成立 如果都不成立 结果不成立
        // 如果第一个条件成立 就会直接输出第一个条件
        // 如果第一个条件不成立 就会直接输出第二个条件
        console.log(true || false); // true
        console.log(false || false); // false
        console.log(true || true); // true

        console.log(1 || 0); //1
        console.log(0 || ''); //0


        // 非 不是  取反  !
        // 非只会对布尔值生效  非布尔值会先转换为布尔值再取反
        // 最终的结果一定是一个布尔值
        console.log(!3);
    </script>
</body>

</html>

关系运算符

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>

    </style>
</head>

<body>
    <script>
        var num1 = 15;
        var num2 = 9;
        console.log(num1 > num2);
        // 大于
        console.log(num1 < num2);
        // 小于
        console.log(num1 == num2);
        // 等于
        // 一个 = 表示 赋值    ==  表示等于

        console.log(num1 >= num2);
        // 大于等于
        console.log(num1 <= num2);
        // 小于等于
        console.log(num1 != num2);
        // 不等于

        // 关系运算符 最终输出的结果一定是一个布尔值  更像是一个判断条件

        console.log("--------------------------------------------------------");


        console.log(1 == "1");
        // 等于  会将等号两边的内容 隐式转换成相同的数据类型

        console.log(1 === "1");
        // 全等于 ===  两边的内容必须完全相同  类型也必须相同
        console.log(1 !== "1");
        // 不全等于


        // console.log(5 > 3 && 3 > 1);
    </script>
</body>

</html>

运算符的优先级

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>

    </style>
</head>

<body>
    <script>
        console.log(4 >= 6 || '人' != '好人' && !(12 * 2 == 144) && true);
        // 4 >= 6 || '人' != '好人' && !false && true
        // 4 >= 6 || '人' != '好人' && true && true
        // false  || '人' != '好人' && true && true
        // true
        // 1. ( )优先级最高
        // 2. 一元运算符  ++   --   !
        // 3. 算数运算符  先*  /  %   后 +   -
        // 4. 关系运算符  >   >=   <   <=
        // 5. 相等运算符   ==   !=    ===    !==
        // 6. 逻辑运算符 先&&   后||
        // 7. 赋值运算符
    </script>
</body>

</html>

条件运算符

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <title>好谷学堂_03-JavaScript</title>
    <style>

    </style>
</head>

<body>
    <script>
        // if(表达式){

        // }
        // 条件表达式 ? 如果表达式结果为true,执行这里的代码1 : 如果表达式结果为false,执行冒号后面的代码2 ;
        var num = Number(prompt('请输入一个数字'));
        num > 10 ? console.log(num + '大于10!!!!') : console.log(num + '小于10????');

        if (num > 10) {
            console.log(num + '大于10');
            console.log('哈哈哈');
            console.log('呵呵呵');
            console.log('嘿嘿嘿');
            console.log('呵呵呵');
        } else {
            console.log(num + '小于10');
        }
    </script>
</body>

</html>