七天学完JavaScript(day02)
七天学完JavaScript(day02)
目录
- 运算符
- 语句
- 银行提款机代码源码
一.运算符
• 算术运算符
• 赋值运算符
• 一元运算符
• 比较运算符
• 逻辑运算符
• 运算符优先级
1.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>
// 准备一个弹窗,接收输入的半径
let r = prompt('请输入圆的半径:')
// 计算圆的面积
let result = 3.14 * r * r
// 显示到浏览器上
document.write(`圆的面积是:${result}`)
</script>
</body>
</html>
显示结果
赋值运算符
常见赋值运算符：= 将等号右边的值赋予给左边, 要求左边必须是一个容器
其他赋值运算符：
+=(num=num+1可以简写成num+=1)
-=
*=
/=
%=
一元运算符
根据所需表达式的个数，分为一元运算符、二元运算符、三元运算符.
二元运算符：
例：
一元运算符：
例： 正负号
自增自减
拿自增举例,自减同理
两个单独使用,都是每执行一次,变量值+1
但是参与运算有区别
前置自增：先自加再使用（记忆口诀：++在前 先加）
后置自增：先使用再自加（记忆口诀：++在后 后加）
比较运算符
注意:
1.字符串比较，是比较的字符对应的ASCII码
2.NaN不等于任何值，包括它本身
3.尽量不要比较小数，因为小数有精度问题
4.不同类型之间比较会发生隐式转换
逻辑运算符：
逻辑运算符里的短路
原因：通过左边能得到整个式子的结果，因此没必要再判断右边
运算结果：无论 && 还是 || ，运算结果都是最后被执行的表达式值，一般用在变量赋值
代码例子:判断一个数是4的倍数，且不是100的倍数
<!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>
let num = prompt('输入一个数')
console.log(num %4 === 0 && num % 100 !== 0)
</script>
</body>
</html>
运算符优先级
二.语句
• 分支语句
• 循环语句
程序三大流程控制语句
写几句就从上往下执行几句，这种叫顺序结构
有的时候要根据条件选择执行代码，这种就叫分支结构
某段代码被重复执行，就叫循环结构
分支语句
If分支语句
三元运算符
switch 语句
if语句有三种使用：单分支、双分支、多分支
单分支
if(条件){
满足条件要执行的代码
}
双分支
if(条件){
满足条件要执行的代码
}else{
不满足条件执行的代码
}
多分支
if(条件1){
满足条件要执行的代码1
}else if(条件2){
代码2
}else if(条件2){
代码3
}
// 可以继续写多个
else{
代码
}
三元运算
一般用来取值
switch语句
释义：
找到跟小括号里数据全等的case值，并执行里面对应的代码
若没有全等 === 的则执行default里的代码
例：数据若跟值2全等，则执行代码2
注意:
- switch case语句一般用于等值判断,不适合于区间判断
- switch case一般需要配合break关键字使用 ,没有break会造成case穿透
循环语句:
讲一下断点调试:
作用：学习时可以帮助更好的理解代码运行，工作时可以更快找到bug
浏览器打开调试界面
- 按F12打开开发者工具
- 点到sources一栏
- 选择代码文件
断点：在某句代码上加的标记就叫断点，当程序执行到这句有标记的代码时会暂停下来
断点后,记得点刷新页面
出现这个,可以点击,看看代码接着往下运行的效果
while 循环
释义：
跟if语句很像，都要满足小括号里的条件为true才会进入执行代码
while大括号里代码执行完毕后不会跳出，而是继续回到小括号里判断条件是否满足，若满足又执行大括号里的代码，然后再回到
小括号判断条件，直到括号内条件不满足，即跳出
注意:
循环的本质就是以某个变量为起始值，然后不断产生变化量，慢慢靠近终止条件的过程。
所以，循环需要具备三要素：
举个例子,输出1-10
<!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>
let i = 1 //这是变量起始值: 1
while(i <= 10){ //小于等于10之前都会循环
document.write(i,'<br>') //这是输出数字在浏览器页面上,<br>是换行
i++ //i++,i就从1加1变成了2,再进入循环,以此类推
}
</script>
</body>
</html>
循环退出
continue：结束本次循环，继续下次循环
break：跳出所在的循环
三.银行取款机代码
用户可以选择存钱、取钱、查看余额和退出功能
<!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>
let money = 1000
while (true) {
let str = prompt(`请选择您的操作:
1.取钱
2.存钱
3.查询余额
4.退出`)
//下面的数字对应操作
if(str === '4') {
break
}
switch (str) {
case '1':
let qu = prompt('取多少')
money = money - qu
break
case '2':
let cun = +prompt('存多少')
money = money + cun
break
case '3':
// ${}配合反引号使用,灵活输出变量
alert(`您的余额是${money}元`)
break
default:
alert('好好看操作')
}
}
</script>
</body>
</html>