前端Java Script基础（四）

流程控制语句

1.语句
• 语句是一个程序的基本单位，JS的程序就是由一条一条语句构成的，每一条语句使用;结尾。

• JS中的语句默认是由上至下顺序执行的，但是我们也可以通过一些流程控制语句来控制语句的执行顺序。
比如：console.log("a = "+a);

2.代码块

• 代码块是在大括号 {} 中所写的语句，以此将多条语句的集合视为一条语句来使用。
• 我们一般使用代码块将需要一起执行的语句进行分组，需要注意的是，代码块结尾不需要加分号。
• 在JS中可以使用{}来为语句进行分组,同一个{}中的语句我们称为是一组语句，它们要么都执行，要么都不执行，一个{}中的语句我们也称为叫一个代码块，在代码块的后边就不用再编写;了
• JS中的代码块，只具有分组的的作用，没有其他的用途
  代码块内容的内容，在外部是完全可见的
• 比如：

{
	var a = 10;	
	alert("hello");
	console.log("你好");
	document.write("语句");
}

3. 流程控制语句

• 流程控制语句：JS中的程序是从上到下一行一行执行的，通过流程控制语句可以控制程序执行流程，使程序可以根据一定的条件来选择执行。
• 语句的分类：条件判断语句、条件分支语句、循环语句

4. 条件判断语句
- 使用条件判断语句可以在执行某个语句之前进行判断，如果条件成立才会执行语句，条件不成立则语句不执行。
** if语句**

• 语法一：if语句
• if语句在执行时，会先对条件表达式进行求值判断，
• 如果条件表达式的值为true，则执行if后的语句；如果条件表达式的值为false，则不会执行if后的语句。
• if语句只能控制紧随其后的那个语句,如果希望if语句可以控制多条语句，可以将这些语句统一放到代码块中
• if语句后的代码块不是必须的，但是在开发中尽量写上代码块，即使if后只有一条语句

if(条件表达式){ 
	语句...
}

比如：

		<script type="text/javascript">		
			var a = 25;			
			if(a > 10 && a <= 20){
				alert("a大于10，并且a小于等于20");//false
			}							
		</script>

语法二：if…else…语句

• 当该语句执行时，会先对if后的条件表达式进行求值判断，如果该值为true，则执行if后的语句；如果该值为false，则执行else后的语句。

if(条件表达式){
	语句... 
}else{ 
	语句... 
}

语法三：if…else if…else

• 当该语句执行时，会从上到下依次对条件表达式进行求值判断
• 如果值为true，则执行当前语句；如果值为false，则继续向下判断；如果所有的条件都不满足，则执行最后一个else后的语句
• 该语句中，只会有一个代码块被执行，一旦代码块执行了，则直接结束语句

				if(条件表达式){
					语句...
				}else if(条件表达式){
					语句...
				}else if(条件表达式){
					语句...
				}else{
					语句...
				}

5. 条件分支语句
条件分支语句也叫switch语句。
语法：

					switch(条件表达式){
						case 表达式:
			 				语句...
			 				break;
			  			case 表达式:
			 				语句...
			 				break;
						default:
							语句...
			 				break;
			 		} 

执行流程：switch…case…语句

• 在执行时会依次将case后的表达式的值和switch后的条件表达式的值进行全等比较，如果比较结果为true，则从当前case处开始执行代码。

• 当前case后的所有的代码都会执行，我们可以在case的后边跟着一个break关键字，这样可以确保只会执行当前case后的语句，而不会执行其他的case。如果比较结果为false，则继续向下比较；如果所有的比较结果都为false，则只执行default后的语句

• switch语句和if语句的功能实际上有重复的，使用switch可以实现if的功能， 同样使用if也可以实现switch的功能，所以我们使用时，可以根据自己的习惯选择。

6. 循环语句
循环语句：通过循环语句可以反复的执行一段代码多次
while循环

• 语法：

				while(条件表达式){
			 			语句...
			  	}

• 执行流程：while语句在执行时，先对条件表达式进行求值判断，如果值为true，则执行循环体，循环体执行完毕以后，继续对表达式进行判断，如果为true，则继续执行循环体，以此类推；如果值为false，则终止循环。

do…while循环

• 语法：

					do{
			 			语句...
					}while(条件表达式)

• 执行流程：do…while语句在执行时，会先执行循环体，循环体执行完毕以后，在对while后的条件表达式进行判断，如果结果为true，则继续执行循环体，执行完毕继续判断以此类推，如果结果为false，则终止循环。

• 实际上这两个语句功能类似，不同的是while是先判断后执行，而do…while会先执行后判断，do…while可以保证循环体至少执行一次，而while不能。

• while 和do…while循环举例：

		<script type="text/javascript">						
			/*	向页面中输出连续的数字	*/
			/*var n = 1;
			document.write(n++ +"<br />");*/
			
			var n = 1;
			
			//向这种将条件表达式写死为true的循环，叫做死循环
			//该循环不会停止，除非浏览器关闭，死循环在开发中慎用
			//可以使用break，来终止循环
			/*while(true){
				alert(n++);
				
				//判断n是否是10
				if(n == 10){
					//退出循环
					break;
				}				
			}*/
			
			//创建一个循环，往往需要三个步骤
			
			//1.创初始化一个变量
			var i = 11;
			
			//2.在循环中设置一个条件表达式
			while(i <= 10){
				//3.定义一个更新表达式，每次更新初始化变量
				document.write(i++ +"<br />")		
			}
			
			do{
				document.write(i++ +"<br />");
			}while(i <= 10);
			
			while(true){
				alert(1);
			}		
		</script>

for循环

• for语句，也是一个循环语句，也称为for循环
• 在for循环中，为我们提供了专门的位置用来放三个表达式：
  1.初始化表达式
  2.条件表达式
  3.更新表达式
• for循环的语法：

					for(（1）初始化表达式;（2）条件表达式;（4）更新表达式){
			  			（3）语句...
			  		}	

• for循环的执行流程：
  ①执行初始化表达式，初始化变量（初始化表达式只会执行一次）
  ②执行条件表达式，判断是否执行循环。如果为true，则执行循环
  ③如果为false，终止循环
  ④执行更新表达式，更新表达式执行完毕继续重复②
• 举例

		<script type="text/javascript">			
			//创建一个执行10次的while循环
			//初始化表达式
			/*var i = 0;			
			//创建一个循环，定义条件表达式
			while(i < 10){
				//设置更新表达式
				alert(i++);
			}*/			
			for(var i = 0 ; i < 5 ; i++ ){
				alert(i);
			}			
			/*
			 * for循环中的三个部分都可以省略，也可以写在外部
			 * 	如果在for循环中不写任何的表达式，只写两个;此时循环是一个死循环会一直执行下去，慎用
			 * 	for(;;){
					alert("hello");
				}
			 */	
		</script>