运算符
一、算术运算符
- 加、减、乘、除、取模 (+, -, *, /, %)
- 加号上下文
- 如果+号左右只有一个值 解析的结果是正号 可用于隐式转换
- 如果两边都是数值(Number)类型 则是+号运算符
- +号的左右如果有一个数据是字符串数据类型的话 那么这个+号会被解析成连接符
- 案例
- 对话框中输入圆的半径，算出圆的面积并显示到页面
let r = prompt('请输入圆的半径')
document.write(`您输入的半径是${r},计算出的结果是${3.14 * r * r}`)
二、赋值运算符 (=)
- 将等号右边的值赋予给左边, 要求左边必须是一个容器
累加 a += 1 （a=a+1）
累减 b -= a (b=b+a)
累乘 a x= 1 (a=ax1)
累除 b /= a (b=b/a)
累余 %=
let a = 1
// a = a + 3
a += 3
console.log(a); //4
三、一元运算符
- 一元运算符: 仅操作一个操作数. 比如: 正负号等
- 自增自减运算符
- 相同点
不管是++或者-- 是在前还是在后,都是在原来的取值上自行增1或减1 类似于 => a += 1
- 不同点
符号前置 => 先加1 再使用 (快捷记忆: ++在前 先加 ++i)
符号后置 => 先使用 再加1 (快捷记忆: ++在后, 后加 i++)
- 面试题：
let i = 1
console.log(i++ + ++i + i) //1+3+3=7
console.log(++i + ++i + i++ + i++); //2+3+3+4=12
四、比较运算符
- > , < , >= , <= , == , === , != , !==
- 比较运算符的使用：
> ： 左边是否大于右边
<： 左边是否小于右边
>=： 左边是否大于或等于右边
<=： 左边是否小于或等于右边
==： 左右两边是否相等,将两边的数据进行转换为数值
===： 左右两边是否类型和值都相等 （开发中一般使用这个）
!==： 左右两边是否不全等 （开发中一般使用这个）
比较结果为boolean类型，即只会得到true或false
- 重点介绍 等于和全等的区别, 推荐使用全等
等于==：是在数字名面上的等于
全等===：是在数字以及数据类型上面都相等
- 特殊说明
- 如果是数字和"其他值"的比较 则其他值会自动转换成数字去比较
尽量不要比较小数，因为小数有精度问题例如：0.1 + 0.2 = 0.30000000000000004
- 涉及到"NAN"都是false （NaN）
NaN不等于任何值，包括它本身
- undefined是false
- 如果是"字符串"和"字符串"比较 则会比较每一个字符的ASCII码,同时是按位进行比较
从左往右依次比较
如果第一位一样再比较第二位，以此类推
比较的少，了解即可
- 如果是布尔值参与比较 布尔值会转换成数字0和1
- 比较运算符返回的结果只有两个，true 或 false
五、逻辑运算符
- 逻辑与 && 并且
符号两边都为true结果才为true
一假则假
- 逻辑或 || 或者
符号两边有一个true就为true
一真则真
- 逻辑非 ! 取反
true变false
false变true
真变假，假变真
// console.log(true && true); // true
// console.log(true && false); // false
// console.log(true || false); // true
// console.log(false || false); // false
// console.log(!true); // false
// console.log(!false); // true
- 逻辑运算符里的短路
原因：通过左边能得到整个式子的结果，因此没必要再判断右边
短路：只存在于 && 和 || 中，当满足一定条件会让右边代码不执行
&& 左边为false就短路，后面的不会执行
|| 右边为true就短路，后面的不会执行
// console.log(false && 3); //false
// console.log(0 && 3); //0 (0在计算机里是false，1是true)
// console.log(undefined && 3) //undefined (undefined表示false)
// console.log(unll && 3) //null (null表示false)
// console.log(0 || 3); //3
// console.log(i=2>3 && i++) //true，而且因为不执行后面的，所以i还是2
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，此时发生了逻辑与中
运算符优先级
语句
### 表达式和语句
- 表达式
- 表达式是一组代码的集合，JavaScript解释器会将其计算出一个结果
- x = 7
- 3 + 4
- num++
- 语句
- js 整句或命令，js 语句是以分号结束（可以省略）
- if 条件语句
- for 循环语句
- 区别
- 表达式计算出一个值，但语句用来自运行以使某件事发生。
- 表达式 3 + 4
- 语句 alert() 弹出对话框
语句分类
- 顺序语句
- 分支语句
- 循环语句
分支语句（if语句）
- if分支
if （条件） {
满足条件要执行的代码
}
// 条件：true执行代码，false不满足-不执行里面的代码
//小括号内的条件若不是布尔类型时，会发生隐式转换转为布尔类型
- 单条分支
- 案例
- 用户输入高考成绩，如果分数大于700，则提示恭喜考入清华大学
let score = prompt('请输入您的高考成绩')
if (score > 700) {
alert('恭喜您考入清华大学')
}
- 双分支
- 案例
- 1.让用户输入年份，判断这一年是闰年还是平年并输出
let year = prompt('请输入一个年份')
if (year % 4 === 0 && year % 100 !== 0 || year % 400 === 0) {
alert('闰年')
} else {
alert('平年')
}
- 多条分支
- 案例
- 根据输入不同时间，输出不同的问候语
let time = +prompt('请您输入现在几点了')
if (time < 12) {
alert('上午好')
} else if (time < 18) {
alert('下午好')
} else if (time < 20) {
alert('晚上好')
} else {
alert('早点睡吧~')
}
执行过程- 释义：
先判断条件1，若满足条件1就执行代码1，其他不执行
若不满足则向下判断条件2，满足条件2执行代码2，其他不执行
若依然不满足继续往下判断，依次类推
若以上条件都不满足，执行else里的代码
注：可以写N个条件
三元运算符
- 条件 ? 表达式1 : 表达式2
- 对比if两条分支的区别
//没有多大的区别，只是比if语句更节俭代码，不过一般应用在不复杂的判断语句中
- 练习案例
- 两个数的比较
console.log(5 < 3 ? 5 : 3); //flase ，执行的结果：3
- 数字补0案例
let num = +prompt('请输入一个数字') // 如果用户输入的数字大于10 不需要补0 如果用户输入的数字小于0 则需要补0
document.write(num >= 10 ? num : '0' + num) //如果是个位数，不满足大于10的条件，故执行第二个代码
分支语句（switch语句）
- switch case
- 出现定值判断使用
- 特点说明
- 0. switch case语句一般用于等值判断,不适合于区间判断
- 2. switch case比较的值全等 ===
- 3. switch case一般需要配合break关键字使用 没有break会造成case穿透
- 案例
- 简单加法器
// 准备三个变量 用户输入的内容默认是 字符串型 我们需要转换成数字型
let num1 = +prompt('请输入第一个数字')
let num2 = +prompt('请输入第二个数字')
// 运算符 operator
let op = prompt('请输入+ - * / 中任意一个运算符')
//switch会根据反馈过来的数值查找不同的case
switch (op) {
case '+':
document.write(`您输入的第一个数字是${num1},您输入的第二个数字是${num2},符号是${op},计算结果为${num1 + num2}`)
break;
case '-':
document.write(`您输入的第一个数字是${num1},您输入的第二个数字是${num2},符号是${op},计算结果为${num1 - num2}`)
break;
case '*':
document.write(`您输入的第一个数字是${num1},您输入的第二个数字是${num2},符号是${op},计算结果为${num1 * num2}`)
break;
case '/':
document.write(`您输入的第一个数字是${num1},您输入的第二个数字是${num2},符号是${op},计算结果为${num1 / num2}`)
break;
default:
alert('您输入的符号有误')
break;
}
分支语句的综合
- if 分支
- 使用的最多的分支语句 任何情况下都可以通用
- 三元运算
- 可以简单理解为两条分支的简写形式,一些简单的两条分支可以使用三元运算符代替
- 相较正常的两条分支语句来说多了一个返回值
- switch case语句
- 当出现了定值判断的时候可以使用
断点调试
- 是为了演示循环语句的过程
- debugger 关键字
- 通过页面检查来进行断点调试：需要再次刷新页面才行
循环语句（while语句）
- while循环
- 循环需要具备三要素：
变量起始值
终止条件（没有终止条件，循环会一直执行，造成死循环）
变量变化量（用自增或者自减）
- 语法
while （循环条件）{
要重复执行的代码（循环体）
}
- 案例
- - 打印1-100以内 所有偶数
let i = 1
while (i <= 100) {
if (i % 2 === 0) {
console.log(i)
}
i++
}
- - 打印1-100的和
let i = 1
let sum = 0
while (i <= 100) {
sum = sum + i 或者 sum += i
i++ //这个i++是必须值，要不然程序会死循环
}
- - 打印1-100以内所有偶数的和
let i = 1
let sum = 0
while (i <= 100) {
// 追加一个判断 你可以累加和 但是必须是偶数才进行和的累加计算
if (i % 2 === 0) {
sum += i
}
i++
}
console.log(sum); //打印相加的结果
- while的使用场景介绍
- 更适合使用在循环的次数不确定时候使用
- do while 循环(课下了解)
语法
do {
statement
}while(expr)
案例：
let n = 1; //声明并初始化循环变量
do { //循环条件
n++; //递增循环变量
if (n % 2 == 0) document.write(n + ""); //执行循环操作
} while (n <= 100);
综合案例 （存钱取钱案例）
/*
1. 由于操作提示是一直弹出的，所以prompt 应该写在while(){循环体}里面
2. 根据用户输入不同的数字，从而实现不同的操作逻辑，所以应该用switch case 分支语句
3. 由于4是退出，所以可以得知循环条件
4. 取款即为减法操作 存款即为加法操作 查看余额为输出操作
*/
// 1. 用户输入的数字应该存储起来
// 创建账户总余额
let money = 0
let option = 0
while (option !== 4) {
// 注意 我们输入的是字符串类型 所以最好转换成数字类型
option = +prompt(`请选择您的操作：
1. 取款
2. 存款
3. 查看余额
4. 退出
`)
// 建立一个switch case 分支 来处理用户不同的选择对应的不同业务处理
switch (option) {
case 1:
// 取款的操作：
// 1. 弹出一个propmt 问用户 取多少钱
// 2. 告诉用户 当前账户还剩多少钱
let qukuan = +prompt('请输入您的取款金额')
// 从 总余额中 减掉用户取出的钱
money = money - qukuan // money -= qukuan
alert(`您的账户当前余额为${money}元`)
break;
case 2:
// 存款的操作：
// 1. 弹出一个prompt 问用户存多少钱
// 2. 告诉用户 当前账户还剩多少钱
let cunkuan = +prompt('请输入您的存款金额')
money = money + cunkuan
alert(`您的账户当前余额为${money}元`)
break;
case 3:
alert(`您的账户当前余额为${money}元`)
break;
case 4:
alert(`成功退出`)
break;
default:
alert('请输入正确的编号')
break;
}
}
