JavaScript基础学习----流程控制

183 阅读5分钟

流程控制

流程控制包括三种方式:

1.顺序结构:从上到下,从左到右依次执行。

2.分支结构:if 语句 if-else 语句 if else-if else-if else 语句 switch-case 三元运算表达式

3.循环结构:while循环 do-while 循环 for循环 for-in循环

分支结构

1.if 语句: 主要用来判断
	语法: if(表达式){
			代码块;
		}
执行过程:先判断表达式结果是true还是flase,如果是true那么执行大括号里面的代码块,如果是false就不执行大括号里面的内容

2.if-else 语句
	语法:
    if(表达式){
    	代码块1;
    }else {
		代码块2;
    }
执行过程:先判断表达式结果是true还是false,如果是true那就执行大括号里面的代码块,如果是false就执行else里面的代码块

3.三元表达式:	? :
	语法:
	var 变量 = 表达式1 ? 表达式2 : 表达式3;
执行过程: 表达式1 的结果是true,那么执行表达式2,并把结果赋值给变量;
		 如果是false那么执行表达式3,并把结果赋值给变量.
ps:绝大多数情况下,if-else语句都可以用三元表达式来替换。

4.if else-if else-if ... else 语句
	语法:
    if(表达式1){
    	代码块1;
    }else if(表达式2){
        代码块2;
    }else if(表达式3){
        代码块3;
    }else{
        代码块4;
    }
执行过程:如果表达式1true,那么执行代码块1;如果表达式1false,那么判断表达式2,如果表达式2true,则执行代码块2;如果表达式2false,那么判断表达式3,如果为true,那么执行代码块3;如果为false那么执行代码块4,结束分支判断.
	ps:else-if 可以写多个,具体写几个看需求
    	else 可以不用写,具体也看需求
        
5.switch-case 语句
    语法:
    switch(表达式){
        case1:
        	代码1;
        	break;
        case2:
        	代码2;
        	break;
        case3:
        	代码3;
        	break;
        ... ...
        default:代码5;
    }
执行过程:获取表达式的值,然后和值1 比较,如果一样,则执行代码1,遇到break跳出整个语句,后面的代码不执行;
		如果表达式的值和值1不一样,则和值2比较,如果一样,就执行代码2,遇到break跳出整个语句;
		如果表达式的值和值2不一样,则和值3比较,如果一样,就执行代码3,遇到break跳出整个语句;
        ···
        如果表达式的值和所有case的值都不一样,则执行default后面的代码5,然后跳出整个语句
ps:default后面的break可以省略,default也可以省略
	switch-case语句中和case后面的值比较时使用的是严格模式,===
 
总结:
        1.分支语句可能有多个分支,但最终只执行一个分支
        2.switch-case 必须有break3.三元表达式和if-else是对两个分支的判断
        4.if else-if ··· else:一般是对范围的判断
        5.switch-case:一般是对具体的值的判断

循环语句

1.while 循环
	语法:
    var 变量 = 0;//这是定义一个计数器
	while(循环的条件){
    	循环体;
        计数器++;//不能忘了
    }
执行过程:
先判断条件是否为true,如果是false,那么循环的代码不执行;如果是true,那么执行循环语句,计数器++,然后回到循环条件再次判断,成立就继续执行循环体,否则跳出循环体;
 	//求帐号和密码是否一致,登录的效果实现
    //提示用户输入帐号
    //提示用户输入密码
    //如果帐号或者密码不对,则一直提示用户输入帐号和密码
    //帐号--admin
    //密码--123---字符串类型

    var userName=prompt("请您输入帐号");//存储帐号的
    var userPwd=prompt("请您输入密码");//存储密码
    while(userName!="admin"||userPwd!="123"){
      //变量的重新赋值
       userName=prompt("请您输入帐号");//存储帐号的
       userPwd=prompt("请您输入密码");//存储密码
    }
    console.log("登录成功");

2.do-while 循环
	语法:
    var 变量名 = 0//定义一个计数器
    do{
        循环体;
        计数器++
    }while(循环条件);
执行过程:先执行一次循环体,然后判断条件是否成立,不成立,则跳出循环体,成立就继续执行···

总结:while  先判断 再执行,循环体有可能一次也不执行
	 do-while 先执行一次循环体,再判断,至少执行一次循环体。

3.for循环
	语法:
    for(表达式1;表达式2;表达式3){
        循环体;
    }
执行过程:先执行一次表达式1,然后判断表达式2,如果不成立直接跳出循环
        如果表达式2成立,执行循环体的代码,结束后,跳到表达式3,然后跳到表达式2,判断表达式2是否成立,不成立则跳出循环。
        如果表达式2 成立,则执行循环体,然后再跳到表达式3,再跳到表达式2,判断是否成立,一直如此。

break 和 continue

1.break 如果在循环中遇到了break,会立刻跳出循环体 2.continue 如果在循环中遇到了continue,会直接进入下一次循环

调试

调试:写代码---打开浏览器--F12(开发人员工具)--->Sources---双击文件,在某一行代码前面点击一下(出现的东西就是断点)