JS基础&&实战--day03

最新推荐文章于 2024-10-08 06:45:00 发布

weixin_56706590

最新推荐文章于 2024-10-08 06:45:00 发布

阅读量87

点赞数

本文链接：https://blog.csdn.net/weixin_56706590/article/details/120943128

版权

JavaScript 流程控制条件判断 if语句代码块

关键词由CSDN通过智能技术生成

代码块

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			
			/* 
				我们的程序是由一一条语句构成的
					语句是按照自上向下的顺序一条一条执行的
					在JS中可以使用{}来为语句进行分组，
						同一个{}中的语句我们称为是一组语句，
						他们要么都执行，要么都不执行，
						一个{}中的语句我们也称为叫一个代码块
						在代码块的后边就不用再编写;了
						
				JS中的代码块，只具有分组的作用，没有其他的用途
					代码块中的内容，在外部是完全可见的
			 */
			{
				var a=10;
				alert("hello");
				console.log("你好");
				document.write("语句");
			}
			
			console.log("a = "+a);
			
			
		</script>
	</head>
	<body>
	</body>
</html>

流程控制语句

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			/* 
				流程控制语句
				 - JS中的程序是从上到下一行一行执行的
				 - 通过流程控制语句可以控制程序执行流程，
					使程序可以根据一定的条件来选择执行
				 - 语句的分类:
					1.条件判断语句
					2.条件分支语句
					3.循环语句
					
					
				条件判断语句:
				 - 使用条件判断语句可以在执行某个语句之前进行判断，
					如果条件成立才会执行语句，条件不成立则语句不执行。
				 - if语句
				 - 语法一:
					if(条件表达式){
						语句...
					}
					if语句在执行时，会先对条件表达式进行求值判断，
					如果条件表达式的值为true，则执行if后的语句，
					如果条件表达式的值为false，则不会执行if后的语句。
							if语句只能控制紧随其后的那个语句，
								如果希望if语句可以控制多条语句，
								可以将这些语句统一放到代码块中
							if语句后的代码块不是必须的，但是在开发中尽量写上代码块，即使if后只有一条语句
					
			 */

			var a = 16;

			if (a > 10 && a <= 20) {
				alert("a大于10，并且a小于等于20");
			}
		</script>
	</head>
	<body>
	</body>
</html>

if语句

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			
			/* 
				if语句
				 语法二:
						if(条件表达式){
							`语句...
						}else{
							 语句...
						}
						
				if...else...语句
						当该语句执行时，会先对if后的条件表达式进行求值判断，
							如果该值为true，则执行if后的语句
							如果该值为false，则执行else后的语句
							
				 语法三:
						if(条件表达式){
							语句...
						}else if(条件表达式){
							语句...
						}else if(条件表达式){
							语句...
						}else{
							语句...
						}
						
						if...else if   else
								当该语句执行时，会从上到下依次对表达式进行求值判断
								如果值为true，则执行当前语句.
								如果值为false，则继续向下判断.
								如果所有的条件都不满足，则执行最后一个else后的语句
								该语句中，只会有一个代码块被执行，一旦代码块执行了，则直接结束语句
			 */
			
			var age=50;
			
			/* if(age>=60){
				alert("你已经退休了~~");
			}else{
				alert("你还没退休~~");
			} */
			
			age=200;
			/* if(age>100){
				alert("活着挺没意思的~~");
			}else if(age>80){
				alert("你也老大不小的了~~");
			}else if(age>60){
				alert("你也退休了~~");
			}else if(age>30){
				alert("你已经中年了");
			}else if(age>17){
				alert("你已经成年了");
			}else{
				alert("你还是个小孩子~~~");
			} */
			
			age=90;
			if(age>17&&age<=30){
				alert("你已经成年了");
			}else if(age>30&&age<=60){
				alert("你已经中年了");
			}else if(age>60&&age<=80){
				alert("你已经退休了");
			}else{
				alert("你岁数挺大的了~~");
			}
		</script>
	</head>
	<body>
	</body>
</html>

练习一

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			/* 
				从键盘输入小明的期末成绩:
				当成绩为100时，'奖励一辆BMW'
				当成绩为[80-99]时，'奖励一台iphone15s'
				当成绩为[60-80]时，'奖励一本参考书'
				其他时，什么奖励也没有
			 */
			
			/* 
			 prompt()可以弹出一个提示框，该提示框中会带有一个文本框，
			  用户可以在文本框中输入一段内容，该函数需要一个字符串作为参数，
			  该字符串将会作为提示框的提示文字
			 
			 用户输入的内容将会作为函数的返回值返回，可以定义一个变量来接收该内容
			 */
			// score就是小明的期末成绩
			var score=prompt("请输入小明的期末成绩:");
			
			// 判断值是否合法
			if(score>100||score<0||isNaN(score)){
				alert("拉出去毙了~~~");
			}else{
				// 根据score的值来决定给小明什么奖励
				if(score==100){
					// 奖励一台宝马
					alert("宝马，拿去~~");
				}else if(score>=80){
					// 奖励一个手机
					alert("手机，拿去玩~~~");
				}else if(score>=60){
					// 奖励一本参考书
					alert("参考书，拿去看~~");
				}else{
					alert("棍子一根~~");
				}
			}
		</script>
	</head>
	<body>
	</body>
</html>

练习二

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			/* 
				大家都知道，男大当婚，女大当嫁。如果女方家长要嫁女儿，当然要提出一定的条件:
				高:180cm以上;富:1000万以上;帅:500以上;
				如果这三个条件同时满足，则:"我一定要嫁给他"
				如果这三个条件有为真的情况，则:"嫁吧，比上不足，比下有余。"
				如果三个条件都不满足，则:"不嫁"!
			 */
			
			var height=prompt("请输入你的身高(CM)");
			var money=prompt("请输入你的财富(万)");
			var face=prompt("请输入你的颜值(PX)");
			
			// 如果这三个条件同时满足，则:"我一定要嫁给他"
			if(height>180&&money>1000&&face>500){
				alert("我一定要嫁给他");
			}else if(height>180||money>1000||face>500){
				// 如果这三个条件有为真的情况，则:"嫁吧，比上不足，比下有余。"
				alert("嫁吧，比上不足，比下有余。");
			}else{
				// 如果三个条件都不满足，则:"不嫁"!
				alert("不嫁。");
			}
		</script>
	</head>
	<body>
	</body>
</html>

练习三

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			/* 
				编写程序，由键盘输入三个整数分别存入变量num1、num2、num3，
				对他们进行排序，并且从小到大输出
				
			 */
			
			// 获取用户输入的三个数
			
			/* 
				prompt()函数的返回值是String类型的
			 */
			
			var num1=+prompt("请输入第一个数:");
			var num2=+prompt("请输入第二个数:");
			var num3=+prompt("请输入第三个数:");
			
			// 找到三个数中最小的数
			if(num1<num2&&num1<num3){
				// num1最小,比较num2和num3
				if(num2<num3){
					// num1 num2 num3
					alert(num1+","+num2+","+num3);
				}else{
					// num1 num3 num2
					alert(num1+","+num3+","+num2);
				}
			}else if(num2<num1&&num2<num3){
				// num2最小,比较num1和num3
				if(num1<num3){
					// num2 num1 num3
					alert(num2+","+num1+","+num3);
				}else{
					// num2 num3 num1
					alert(num2+","+num3+","+num1);
				}
				}else{
					// num3最小,比较num1和num2
					if(num1<num2){
						// num3 num1 num2
						alert(num3+","+num1+","+num2);
					}else{
						// num3 num2 num1
						alert(num3+","+num2+","+num1);
					}
				}
		</script>
	</head>
	<body>
	</body>
</html>