JavaScript运算符
算数运算符
算数运算符 : 进行数学运算的符号
数学运算符也叫算术运算符,主要包括加、减、乘、除、取余(求模)
+: 进行加法运算
1、当符号两边都是数字或者布尔的时候会进行数学运算
2、只要符号任意一边是字符串的时候 就会进行字符串拼接
- 减法运算 * 乘法运算 / 除法预算 % 取余运算 都是进行数学运算
取余运算 :先进行除法运算 获取除法运算元素后 剩下余数
<script>
console.log(20 - 10)
console.log(20 * 10)
console.log(20 / 10)
// 取余运算 先进行除法运算 获取除法运算元素后 剩下余数
console.log(2 % 5)
console.log(10 % 5)
// 如果一行内 出现了多个算术运算符
// 先乘除后加减 如果有括号 就先算括号
console.log(1 + 1 * 2);
console.log((1 + 1) * 2);
// 如果一行内 确实很多个算术运算符 都建议按照自己的想法来加括号
console.log(1 + (2 * 3 + 3) / 4 + 4 * 4 + 5);
</script>
同时使用多个运算符编写程序时,会按着某种顺序先后执行,我们称为优先级。
JavaScript中 优先级越高越先被执行,优先级相同时以书从左向右执行。
乘、除、取余优先级相同 加、减优先级相同 乘、除、取余优先级大于加、减 使用 ( ) 可以提升优先级
总结: 先乘除后加减,有括号先算括号里面的
案例:计算圆的面积
需求:对话框中输入圆的半径,算出圆的面积并显示到页面
分析:
①:面积的数学公式: π*r²
②:转换为JavaScript写法 : 变量 * r * r
计算圆的面积:计算单位 :π 用 Math.PI 代表
<script>
// π * r 的平方
// 在js中 通过Math.PI来代表 π
let r = prompt('请输入圆的半径')
console.log('圆的面积是:'+ Math.PI * r * r)
</script>
赋值运算符
赋值运算符 :进行赋值操作的符号
使用这些运算符可以在对变量赋值时进行快速操作
<script>
let n1 = 10
// 加等于运算 就是n1的值 + 10 即是10 + 10 最后结果20
n1 += 10
console.log(n1)
let n2 = 10
n2 -= 10
console.log(n2)
let n3 = 10
n3 *= 10
console.log(n3)
let n4 = 10
n4 /= 10
console.log(n4)
let n5 = 10
n5 %= 10
console.log(n5)
// 其余的计算方式都一样
</script>
一元运算符
自增自减运算符 : 单独对一个变量进行 +1 或者 -1 操作的符号
符号 ++ : 自增运算符 表示在自身的基础上加1
符号 - - : 自减运算符 表示在自身的基础上减1
除符号不一样 两者计算方式一样
分为前置加加 和 后置加加 两种 都是让自身的变量加1
前置是在变量前添加 符号 如++n
前置添加 计算方式 是 先把变量的值改变 再用改变后的值参与运算
后置是在变量后面加 符号 如 n++
后置加加 则是先把变量的值参与运算 再把变量的值改变
自增示例:
<script>
let i = 1
console.log(++i + 2); //结果是4
// 注意 :i 是2
// i 先自加1, 变成2之后 再和后面的2相加
let age = 1
console.log(age++ + 2); //结果是3
// 注意 :此时的 i 是1
// 先和 2 相加 先运算输出完毕后 i 再自加是2
// 要查询后置加加的结果 在后面在打印age的结果
console.log(age);
</script>
自减示例:
<script>
let i = 2
console.log(--i + 2); //结果是3
// i 先自减1, 变成1之后 再和后面的2相加
let age = 2
console.log(age-- + 2);//结果是4
// 注意 :此时的 i 还是2
// 先和 2 相加 先运算输出完毕后 i 再自减是1
</script>
一元运算符的面试题案例:
<script>
let i = 1
// 面试题 实际结果为7
console.log(i++ + ++i + i);
// 步骤分为两部 第一步 i++ 后置加加 此时为1 结果出来后再自增 为2
// 第二步 ++i 此时第一步已完成后自增 为2 先自增再算值 就是 1+2=3
// 后面的i 就是前面的值 3 所以就是 1 + 3 + 3 = 7
</script>
比较运算符
比较运算符: 进行 比较运算 的符号
作用:比较两个数据大小、是否相等
得到的结果不是 true 就是 false
符号 : > :大于比较 < : 小于比较 >= :大于等于 <= 小于等于
以下得到的结果都是 true
<script>
console.log(200 > 100)
console.log(100 < 200)
console.log(100 >= 100)
console.log(100 <= 100)
</script>
另外还有 专门比较等于的 :
== :等于比较 只比较 值 是不是相等 不考虑数据类型
===: 全等于比较 必须要 值 和 数据类型都相等 才是 true
!= : 不等于比较 比较 值 是不是不相等 不考虑数据类型
!== : 不全等于比较 只要 值 和 数据类型任何一个不相等 就是 true
<script>
// ==: 只比较 值 是不是相等 不考虑数据类型
console.log(100 == 100)
console.log(100 == '100')
// ===: 必须要 值 和 数据类型都相等 才是 true
console.log(100 === 100)
console.log(100 === '100')
// !=: 不等于比较 比较 值 是不是不相等 不考虑数据类型
console.log(100 != 100)
console.log(100 != '100')
// !==: 不全等于比较 只要 值 和 数据类型任何一个不相等 就是 true
console.log(100 !== 100)
console.log(100 !== '100')
</script>
比较 一般都是对数字做比较
对于字符串做比较 更多是判断两者是否相等
// console . log('A' === 'B')
如果拿字符串去大小比较 判断标准是 先把字符串 拿去做 转数字
// 转完了数字之后 才能根据数字大小比较
如:
console . log ('A' > 'B') 结果为 false A为65 B为66 所以不是A大于B
// NaN = A NaN = B
console . log (NaN === NaN) false 不能以为两者代码一样就相等 (不是一个数字)
// JS 处理小数 有问题 后面会补充 精度问题 在数学的角度没问题 但是在代码的世界就不一样
console . log (0.4 + 0.2 === 0.6)false
逻辑运算符
逻辑运算符 : 进行 逻辑运算 的符号
&& : 与 运算 必须两边都为 true 最终结果才是 true
<script>
// && : 必须两边都为 true 最终结果才是 true
let num = 6
console.log(num > 5 && num < 10) //结果都为 true
console.log(num > 5 && num > 10) //结果都为 false 有一个结果为假 一假则假
console.log(true && true);
console.log(true && false);
console.log(false && true);
console.log(false && false);
</script>
|| : 或 运算 只要任意一边为 true 最终结果就是 true
<script>
// || : 只要任意一边为 true 最终结果就是 true
let money = 10
console.log(money === 1 || money === 0) // 一真则真
console.log(true || true);
console.log(true || false);
console.log(false || true);
console.log(false || false);
</script>
! : 非 运算 (取反运算)本身是 true 结果就是 false 本身是 false 结果就是 true
<script>
// ! : 本身是 true 结果就是 false 本身是 false 结果就是 true
console.log(!true);
console.log(!false);
</script>
案例 :判断一个数是4的倍数,且不是100的倍数
需求:用户输入一个,判断这个数能被4整除,但是不能被100整除
分析:
①:用户输入
②:控制台: 是否能被4整除并且不能被100整除
<script>
// 判断一个数是4的倍数 且不是100的倍数
let digit = prompt('请输入你的数字')
console.log(digit % 4 === 0 && digit % 100 !== 0 );
// 要知道 逻辑与 还是 逻辑或 数一数有几个条件
// console.log((条件1) &&(条件2));
// 1、获取到用户的一个输入
// 2、判断是否满足某些条件
// 1、条件1 这个数可以被4 整除 % 整除和不整除的区别就在于 a % b = 0
// 2、条件2 这个数不能被100 整除 %
// 等于0 就是被整除 不等于0 = 不被整除
// 小结:
// 1、逻辑与 还是 逻辑或
// 2、当前是几个判断条件
// 3、写出大体的结构 console.log((条件1) &&(条件2));
// 4、按个网里面填充我们的代码即可
</script>
小结:
1、逻辑与 还是 逻辑或
2、当前是几个判断条件
3、写出大体的结构 console.log((条件1) &&(条件2));
4、按个网里面填充我们的代码即可
逻辑运算符的两个短路运算
逻辑运算符里的短路 :只存在于 && 和 || 中,当满足一定条件会让右边代码不执行
运算结果:无论 && 还是 || ,运算结果都是最后被执行的表达式值,一般用在变量赋值
<script>
// 一假则假 && 左边为false 右边就不在=再执行
console.log(2 > 10 && 1 < 3 && 3 > 1 && 9 > 5 && 5 < 10 && 8 > 2)
// 工作常见的写法
// 如果今天还下雨 那我就去打架
// 不下雨 不去打架
// false 不成立 假 不执行 true 成立 真 执行
let rain = true
// 左边成立 右边才会去执行
rain && console.log('下雨 干架去');
// 逻辑或 一真则真
// 只要 || 左边成立了 为true 右边就不再执行 为false 就去执行
console.log(100 > 3 || 2 > 6 || 9 > 10 || 10 > 11 || 13 > 20);
// 工作常用技巧
// 如果下雨 那么我就不玩了 真 不执行 假 执行
let rain1 = false
rain1 || console.log('去玩');
// 两个短路运算 逻辑或 和 逻辑与
// 工作中的语法 逻辑与 来说 满足了 就去执行
// 工作中的语法 逻辑或 来说 不满足了 就去执行
</script>
判断
<script>
// 我们的 undefined 如果 转换成 布尔类型 其实是个false
// 那段代码是最后执行即可
let result = 1 > 0 && 30
console.log(result)
</script>
转换成false只有五个内容 其他都会转成true
false : 分别是 0 nan ‘ 空字符串 ’ undefined null NaN 这几个内容
运算符优先级
目标:掌握运算符优先级,能判断运算符执行的顺序
优先级 | 运算符 | 顺序 |
---|---|---|
1 | 小括号 | ( ) |
2 | 一元运算符 | ++ -- ! |
3 | 算数运算符 | 先 * / % 后 + - |
4 | 比较运算符 | > > = < <= |
5 | 相等运算符 | == != === !== |
6 | 逻辑运算符 | 先 && 后 || |
7 | 赋值运算符 | = |
8 | 逗号运算符 | , |
一元运算符里面的逻辑非优先级最高 逻辑与比逻辑或优先级高
判断