JS学习第三天
目录
前言
web前端学习第18天,js第三天学习开始
一、分支结构
- 程序 = 数据 + 算法
- 程序的执行方式:顺序执行、选择执行、循环执行
1.1if语句
if(条件表达式){ 语句块 }
- 0 NaN '' null undefined 以上5个值作为条件表达式会转为false
如果if后的语句块中只有一行语句,则大括号可以省略不写
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>if语句</title> </head> <body> <script> //需求:声明变量保存商品的总价,判断总价是否满30,满30-15,输出结果 var price = 5 //判断价格是否满30 if(price>=30){ price -= 15 //满30才会减15 } console.log(price) //练习:声明变量保存商品的总价total,如果总价在1000~2000之间 //对总价打九折,并且'赠送一瓶洗发水',最后输出实际支付价格 var total = 200 if(total >=1000 && total <=2000){ total *= 0.9 console.log('赠送洗发水一瓶') } console.log(total) </script> </body> </html>
1.2if-else语句
If(条件表达式){ 语句块1,当条件表达式的结果为true时执行 }else { 语句块2,当条件表达式的结果为false时执行 }
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>if-else语句</title> </head> <body> <script> //三元运算符 条件表达式 ?表达式1 : 表达式2 //age>=18 ? '成年人' : '未成年人' var age = 110 if(age>=18){ console.log('成年人') }else { console.log('未成年人') } //练习:声明变量保存数字num,判断是奇数还是偶数,并输出XXX是X数 var num = 101 if(num %2 === 0){ console.log(num+'是偶数') }else { console.log(num+'是奇数') } //练习:声明变量保存用户名和密码 //如果是admin 123456,打印'登录成功',反之打印'登录失败' var user = 'admin' var pwd = '123456' if(user === 'admin' && pwd === '123456'){ console.log('登录成功') }else { console.log('登录失败') } //练习:声明变量保存一个人的性别gender(值是1或0) //判断性别,打印'男'或'女' //要求:使用if-else和三目运算两种方式实现 var gender = 0 if(gender){ console.log('男') }else{ console.log('女') } </script> </body> </html>
1.3If-else嵌套
适合有多项需要判断的时候使用 if(条件表达式1){ 语句块1,当条件表达式1的结果为true时执行 }else if(条件表达式2 ){ 语句块2,当条件表达式2的结果为true时执行 }else if(条件表达式n){ 语句块n,当条件表达式n的结果为true时执行 }else { 语句块n+1,以上所有条件都是false时执行 }
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>if-else的嵌套</title> </head> <body> <script> // 声明变量,保存学生的成绩score,根据学生的成绩档位输出评定结果。细则如下: // 90~100 优秀 // 80~90 良好 // 70~80 中等 // 60~70 及格 // 60以下 不及格 // 判断成绩的合法性,如果成绩不在0~100之间,打印'非法的成绩' var score = 6 if(score>100 || score <0){ console.log('非法的成绩') }else if(score >=90 ){ console.log('优秀') }else if(score >=80 ){ console.log('良好') }else if(score >=70 ){ console.log('中等') }else if(score >=60 ){ console.log('及格') }else { console.log('不及格') } //练习:声明变量保存原价,满1000打9折,满2000打8折,满5000打7折 //输出结果:原价XXX,实际应支付XXX var price = 100 //商品的原价 var count = price //实际支付的价格 if(price >=5000){//满5000 count = price * 0.7 //打7折 }else if(price >=2000){ //满2000 count = price * 0.8 //打8折 }else if(price >=1000){ //满1000 count = price * 0.9 //打9折 } console.log('原价'+price+',实际应支付'+count) </script> </body> </html>
4.switch-case语句
- 是一种特殊的多项分支语句,条件只能进行全等于的比较
格式: switch(表达式){ case 值1: 语句块1 Break case 值n: 语句块n break default: 语句块n+1 }
- 注意事项:
- switch执行时会拿着表达式的值与case后的值做比较,如果全等,会执行对应case后的内容
- break用于跳出switch,如果对应case后没有添加break,会发生”穿透现象”
- default是“保底选项”,也就是说如果前面的case都没有被匹配到会执行default
- 如果switch中没有添加任何的break,一旦发生穿透,也包含default
- break与default都是可选项,不是必须要加的,要根据业务决定是否使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>switch-case语句</title> </head> <body> <script> //声明一个变量用来保存选项值 var n = 1 switch(n){ //拿着n的值依次与case后的值作比较,如果相等就会执行对应case后的语句 //如果执行到的case后没有break,会发生"穿透"现象 //如果前面的所有case都没有匹配到,就会执行default默认选项 case 1 : console.log('迪拜') // break case 2 : console.log('土耳其') break case 3 : console.log('威尼斯') break default: console.log('大理') } </script> </body> </html>
二、位运算符(了解)
- 模拟计算机底层的运算,先把值转为2进制再进行运算,运算完再把结果转回成10进制
- 10进制:
1 2 3 4 5 6 7
对应的2进制数据:
1 10 11 100 101 110 111
- & 按位与,上下两位比较,都是1结果是1,否则是0 【全1才1】
- | 按位或,上下两位比较,有一个是1结果是1,否则是0 【有1则1】
- ^ 按位异或,上下两位比较,不同是1,否则是0 【相同为0,不同为1】
<script> console.log(5&7) //5 console.log(3&5) //1 console.log(7|13) //15 console.log(9^15) //6 </script>
总结
day18-js03学习结束