本文详细介绍了JavaScript的运算符种类，如算术、赋值、一元、比较、逻辑运算，以及语句中的表达式、分支、循环、三元运算符和综合案例。通过实例演示，帮助读者理解运算符优先级和如何在实际编程中运用这些概念。
一、运算符
1. 算术运算符
- 加 +
- 减 -
- 乘 *
- 除 /
- 取余 % （开发中经常作为某个数字是否被整除）
2. 赋值运算符
对变量进行赋值的运算符。
- =
- +=
- -=
- *=
- /=
- %=
3. 一元运算符
JavaScript的运算符可以根据所需表达式的个数，分为一元运算符、二元运算符、三元运算符
- 自增：++ 让变量的值+1
- 自减： – 让变量的值-1
前置自增和后置自增单独使用没有区别
前置自增和后置自增如果参与运算就有区别：
-
前置自增：先自加再使用
let i = 1 console.log(++i + 2) //结果是 4 // 注意：i 是 2 // i 先自加 1，变成 2 之后，再和2相加 -
后置自增：先使用再自加
let i = 1 console.log(i++ + 2) //结果是 3 // 注意：此时的 i 是 1 // i 先和 2 相加，先运算输出完毕后，i 再自加 2
面试题
let i = 1
console.log(i++ + ++i + i) //结果是 7
4. 比较运算符
比较两个数据大小，是否相等
><>=<===：左右两边是否相等===：左右两边是否类型和值都相等!==：左右两边是否不全等- 比较结果为boolean类型，即只会得到true或false
字符串比较，是比较的字符对应的ASCII码
- 从左往右依次比较
- 如果第一位一样再比较第二位，以此类推
console.log('pink' > 'red') //false
console.log('pink' > 'pin') //true
NaN不等于任何值，包括它本身
console.log(1 === NaN) //false
尽量比较小数，因为小数有精度问题
console.log(0.1 + 0.2 === 0.3) //false
console.log(0.1 + 0.2) //0.30000000000000004
不同类型之间比较会发生隐式转换
console.log(3 > '2') //true
5. 逻辑运算符
| 符号 | 名称 | 日常读法 | 特点 | 口诀 |
|---|---|---|---|---|
&& | 逻辑与 | 并且 | 符号两边都为true结果才为true | 一假则假 |
或 | 逻辑或 | 或者 | 符号两边有一个true就为true | 一真则真 |
！ | 逻辑非 | 取反 | true变false，false变true | 真变假，假变真 |
// 逻辑与，一假则假
console.log(true && true) //true
console.log(false && true) //false
// 逻辑或，一真全真
console.log(false || true) //true
console.log(false || false) //false
// 逻辑非，取反
console.log(!true) //false
console.log(!false) //true
逻辑运算符里的短路：只存在于&&和||中，当满足一定条件会让右边代码不执行。
| 符号 | 短路条件 |
|---|---|
&& | 左边为false就短路 |
逻辑或 | 左边为true就短路 |
原因：通过左边能得到整个式子的结果，因为没必要再判断右边
运算结果：无论&&还是||，运算结果都是最后被执行的表达式值，一般用在变量赋值
6. 运算符优先级
| 优先级 | 运算符 | 顺序 |
|---|---|---|
| 1 | 小括号 | () |
| 2 | 一元运算符 | ++ -- ! |
| 3 | 算数运算符 | 先* / %后+ - |
| 4 | 关系运算符 | > >= < <== |
| 5 | 相等运算符 | == != === !== |
| 6 | 逻辑运算符 | 先&&后逻辑或 |
| 7 | 赋值运算符 | = |
| 8 | 逗号运算符 | , |
二、语句
1. 表达式和语句
表达式是一组代码的集合，JavaScript解释器会将其计算出一个结果
js整句或命令，js语句是以分号结束（可以省略）
区别：表达式计算出一个值，但语句用来自行以使某件事发生
2. 分支语句
2.1 程序三大流程控制语句
- 顺序结构：从上往下执行
- 分支结构：根据条件选择执行代码
- 循环结构：某段代码被重复执行
2.2 分支语句
-
if分支语句
单分支
if (条件) { 满足条件要执行的代码 }双分支
// 计算工资 // 1. 用户输入工龄 let age = prompt('请输入工龄') let salary = 10000 // 2. 执行分支语句 if (age >= 1) { alert(`您实发工资：${salary + 2000}`) } else { alert(`您实发工资：${salary}`) } // 计算闰年 // 1. 用户输入年份 let year = prompt('请输入年份：') // 2. 执行分支语句 if (year % 4 === 0 && year % 100 !== 0 || year % 400 ===0) { alert(`${year}是闰年`) } else { alert(`${year}是平年`) }多分支
// 分时问候 // 1. 用户输入时间 let time = prompt('请输入时间：') // 2. 多分支判断 if (time < 12) { document.write(`上午好，好好工作`) } else if (time < 18) { document.write(`下午好，好好工作`) } else if (time < 20) { document.write(`晚上好，好好加班`) } else { document.write(`夜深了，好好休息`) } -
三元运算符
是比if双分支跟更简单的写法，有时候也叫做三元表达式
？与：配合使用
条件 ? 满足条件执行的代码 : 不满足条件执行的代码 true ? 1 : 2 3 > 5 ? alert('第一个') : alert('第二个')一般用来取值
-
switch语句
找到跟小括号里数据全等的case值，并执行里面对应的代码
若没有全等===的则执行default里的代码
switch case语句一般用于等值判断，不适合区间判断
switch case一般需要配合break关键字使用，没有break会造成case穿透
switch (2) { case 1: alert(1) break case 2: alert(2) break case 3: alert(3) break default: alert('没有数据') }简单计算器
// 1. 用户输入数字 运算符 let num1 = +prompt('请输入第一个数：') let num2 = +prompt('请输入第二个数：') let sp = prompt('请输入+ - * /运算符：') // 2. 根据不同的运算符计算不同的结果 switch (sp) { case '+': alert(`您选择的是加法，结果是：${num1 + num2}`) break case '-': alert(`您选择的是减法，结果是：${num1 - num2}`) break case '*': alert(`您选择的是乘法，结果是：${num1 * num2}`) break case '/': alert(`您选择的是除法，结果是：${num1 / num2}`) break default: alert(`请输入+ - * /`) }
3. 循环语句
3.1 断点调试
浏览器打开调试界面：
- 按F12打开开发者工具
- 点到sources一栏
- 选择代码文件
断点：在某句代码上加的标记就叫断点，当程序执行到这句有标记的代码时会停下来
3.2 while循环
while (循环条件) {
要重复执行的代码(循环体)
}
- 跟if语句很像，都要满足小括号里的条件为true才会进入执行代码
- while大括号里代码执行完毕后不会跳出，而是继续回到小括号里判断条件是否满足，若满足又执行大括号里的代码，然后再回到
小括号判断条件，直到括号内条件不满足，即跳出
循环具备三要素：
- 变量起始值
- 终止条件（没有终止条件，循环会一直执行，造成死循环）
- 变量变化量（用自增或者自减）
// 循环必须有三个要素
// 变量起始值
let i = 1
// 终止条件
while (i <= 100) {
document.write(`我会循环100次 <br>`)
// 变量变化
i++
}
// 1. 输出1-100个数字
let i = 1
while (i <= 100) {
document.write(`第${i}个数是${i} <br>`)
i++
}
// 2. 计算1+到100的总和并输出
let j = 1
let sum = 0
while (j <= 100) {
sum += j
j++
}
document.write(`1-100的总和为${sum}`) //5050
// 3. 计算1-100之间的所有偶数和
let z = 0
let sum1 = 0
while (z <= 100) {
sum1 += z
z = z+2
}
document.write(`1-100的偶数和为${sum1}`) //2550
let i = 1
let sum = 0
while (i <= 100) {
if(i % 2 ===0) {
sum += i
}
i++
}
document.write(`1-100的偶数和为${sum}`) //2550
continue：结束本次循环，继续下次循环
break：跳出所在循环
三、综合案例
简易ATM取款机
// 1. 不断的弹出对话框
// 3. 余额变量
let money = 100
while (true) {
let str = prompt(`
请你选择操作：
1. 存钱
2. 取钱
3. 查看余额
4. 退出
`)
// 2. 除非输入的是4，则退出循环
if (str === '4') {
break
}
// 4. switch 加减操作
switch (str) {
case '1':
let save = +prompt('请您输入存钱的金额：')
money += save
break
case '2':
let spend = +prompt('请您输入取钱的金额：')
money -= spend
break
case '3':
alert(`您卡上的余额是${money}元`)
break
}
}
用户登录验证
let msg = prompt('请输入用户名')
let pwd = prompt('请输入密码')
while (msg !== 'admin' || pwd !== '123456') {
alert('请你先登录')
msg = prompt('用户名')
pwd = prompt('密码')
}
alert('登录成功')
求1-100之间个位数不为3的数的累加和
// 1. 求1-100之间个位数不为3的数的累加和
let i = 1
let sum = 0
while (i <= 100) {
if (i % 10 !== 3)
sum += i
i++
}
document.write(sum)
扫一扫
560
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
