Web前端,JS基础之算术、赋值、一元、比较、逻辑运算符和优先级

69 阅读4分钟

前言

持续学习总结输出中,今天分享的是Web前端,JS基础之算术、赋值、一元、比较、逻辑运算符和优先级

1、算术运算符

数学运算符也叫算术运算符,主要包括加、减、乘、除、取余(求模)。 +:求和 -:求差 *:求积 /:求商 %:取模(取余数) 开发中经常作为某个数字是否被整除

算术运算符执行的优先级顺序 同时使用多个运算符编写程序时,会按着某种顺序先后执行,我们称为优先级。 JavaScript中 优先级越高越先被执行,优先级相同时以书从左向右执行。 乘、除、取余优先级相同 加、减优先级相同 乘、除、取余优先级大于加、减 使用 () 可以提升优先级 总结: 先乘除后加减,有括号先算括号里面的~~~

<script>
        console.log(4 / 2)
        console.log(4 % 2)
        console.log(2 % 4)
        console.log(5 % 8)
    </script>

运行结果: 请添加图片描述

2、赋值运算符

赋值运算符:对变量进行赋值的运算符 已经学过的赋值运算符:= 将等号右边的值赋予给左边, 要求左边必须是一个容器 其他赋值运算符: += -= *= /= %=

使用这些运算符可以在对变量赋值时进行快速操作

+= 赋值运算符来举例

	<script>
       let num = 18
       num = num + 1
       console.log(num)   // 结果是 19
    </script>

简写

	<script>
       let num = 18
       num +=  1 
       console.log(num)  // 结果是 19
    </script>

3、一元运算符

众多的 JavaScript 的运算符可以根据所需表达式的个数,分为一元运算符、二元运算符、三元运算符 二元运算符:

	<script>
	let num = 18 + 20
    </script>

一元运算符:

	<script>
		++num    等价于  num += 1
       num++
       console.log(num)
    </script>

我们可以有更简便的写法了~~~

自增: 符号:++ 让变量的值 +1

自减: 符号:-- 让变量的值 -1

使用场景: 经常用于计数来使用。 比如进行10次操作,用它来计算进行了多少次了

自增运算符的用法:

  1. 前置自增和后置自增独立使用时二者并没有差别!
  2. 一般开发中我们都是独立使用
  3. 后面 i++ 后置自增会使用相对较多

4、比较运算符

比较两个数据大小、是否相等

比较运算符:

: 左边是否大于右边 <: 左边是否小于右边 =: 左边是否大于或等于右边 <=: 左边是否小于或等于右边 ==:左右两边是否相等 ===: 左右两边是否类型和值都相等 !==: 左右两边是否不全等 比较结果为boolean类型,即只会得到true或false

字符串比较,是比较的字符对应的ASCII码 从左往右依次比较 如果第一位一样再比较第二位,以此类推 比较的少,了解即可

NaN不等于任何值,包括它本身

尽量不要比较小数,因为小数有精度问题

不同类型之间比较会发生隐式转换 最终把数据隐式转换转成number类型再比较 所以开发中,如果进行准确的比较我们更喜欢 === 或者 !==

5、逻辑运算符

逻辑运算符用来解决多重条件判断

符号名称日常读法特点口诀
&&逻辑与并且符号两边都为true 结果才为true一假则假
逻辑或或者符号两边有一个 true就为true一真则真
!逻辑非取反true变false false变true真变假,假变真

|| 逻辑或

逻辑运算符里的短路

短路: 只存在于 && 和 || 中,当满足一定条件会让右边代码不执行 请添加图片描述 原因: 通过左边能得到整个式子的结果,因此没必要再判断右边

运算结果: 无论 && 还是 || ,运算结果都是最后被执行的表达式值,一般用在变量赋值

	<script>
		console.log(false && 20)  //false
        console.log(5 < 3 && 20)  //false
        console.log(undefined && 20) //undefined
        console.log(null && 20) //null
        console.log(0 && 20) // 0
        console.log(10 && 20) // 20
    </script>
	<script>
		console.log(false || 20) // 20
        console.log(5 < 3 || 20) // 20
        console.log(undefined || 20) // 20
        console.log(null || 20) // 20
        console.log(0 || 20) // 20
        console.log(10 || 20) // 10
    </script>

6、运算符优先级

优先级运算符顺序
1小括号()
2一元运算符++ - - !
3算数运算符先 * / % 后 + -
4关系运算符> >= < <=
5相等运算符== != === !==
6逻辑运算符先 && 后
7赋值运算符=
8逗号运算符,

先 && 后 ||

一元运算符里面的逻辑非优先级很高 逻辑与比逻辑或优先级高

	<script>
	let a = 3 > 5 && 2 < 7 && 3 == 4 
        console.log(a);   
        //false ,此时发生了逻辑中断

        let b = 3 <= 4 || 3 > 1 || 3 != 2 
        console.log(b);  
        //true,此时发生了逻辑中断


        let c = 2 === "2"
        console.log(c);
         //false ,数据类型不匹配

        let d = !c || b && a 
        console.log(d); 
         //true,此时发生了逻辑中断
    </script>

7、总结

在这里插入图片描述

最后分享一句话:

说出来的话要有建设性,如果无话可说,就保持沉默。 《不抱怨的世界》