爱前端公开课学习笔记——JS03 运算符

运算符的概述和加减运算课程丢失

乘法* 除法/

直接在控制台中演示

主要是不要省略乘号

字符串不能进行乘除法运算

布尔型可以进行乘除法运算 false： 0 true： 1

乘除法的优先级相同，比加减法优先级高（加减法优先级相同）

如果要提升优先级，使用小括号，（略）

注意非0/0= NaN ， 0/0 = Infinity

乘方 Math.pow

Math.pow(2,3); //2*2*2

Math是JS的内置对象，里面蕴含很多的数学运算。

开方

Math.sqrt

案例1 数学算式转换为JS的写法：

注意口号不要写岔了

另外主要math的首字母大写，否则报错

取余运算 %

优先级与乘除相同

自增运算符 ++ --

a ++ 与a = a + 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>
</head>
<body>
    <script>
        var a =3;
        a++;
        console.log(a);
    </script>
</body>
</html>

得到4

但是直接console.log(a++) 却不同

<!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>
</head>
<body>
    <script>
        var a =3;
        //a++;
        //console.log(a);
        console.log(a++);
    </script>
</body>
</html>

此时输出

这是由于a++，执行console.log(a) 再做a++

<!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>
</head>
<body>
    <script>
        var a =3;
        //a++;
        //console.log(a);
        console.log(a++);
        console.log(a);
    </script>
</body>
</html>

第15行a = 15

注意下列代码的输出：

<!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>
</head>
<body>
    <script>
        var a = 3;
        var b = a++;
        //a++;
        //console.log(a);
        //console.log(a++);
        console.log(a);
        console.log(b);
    </script>
</body>
</html>

此时a= 4，b= 3，b = a++时，先b = a 在a++

为了解决这个不方便，可以把++前置

<!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>
</head>
<body>
    <script>
        var a = 3;
        var b = ++a;
        console.log(a);
        console.log(b);
    </script>
</body>
</html>

逻辑运算符

！非

&& 与都真才真

|| 或有真才真

注意：

非0为真
字符串不为空就是真

短路运算

5 && 13 //13

都真才真，5已经真了，所以后边的13是结果，13真才真 13是表达式的结果

0 || 13 //0

0已经是假了，0 是结果

5 || 13 //5

5已经是真了，不用看13

0 || 13 //13

0 是假，要看13 13是结果

posted on 2022-05-09 13:38 jilingxf 阅读(46) 评论(0) 收藏举报

刷新页面返回顶部

jilingxf

爱前端公开课学习笔记——JS03 运算符

导航

公告