当前位置 博文首页 > 信息技术智库：??JavaScript系列6部曲：流程控制（万字长文）??
🎈 作者：不吃西红柿
🎈 简介：CSDN博客专家🏆、蓝桥签约作者、Python领域优质创作者、「信息技术智库」公号作者?。技术交流、面试刷题尽管关注咨询我。
热门专栏推荐：
🥇?知识集锦专栏：大数据生态硬核学习资料 & 面试真题集锦?
🥈?数据仓库专栏：数仓发展史、建设方法论、实战经验、面试真题?
🥉?Python专栏：Python相关黑科技：爬虫、算法、小工具?
（优质好文持续更新中……）?
创作不易，点赞👍 关注💪 鼓励「不吃西红柿」吧~
CSDN私信回复「资料」惊喜等你！！
流程控制即代码的执行过程，有三种方式：
1.顺序结构:从上到下,从左到右执行的顺序,就叫做顺序结构
2.分支结构:if语句,if-else语句,if-else if-else if…语句,switch-case语句,三元表达式语句
3.循环结构:while循环,do-while循环,for循环,后期还有一个for-in循环
语法：
语法:if(表达式){代码块?}
执行过程:先判断表达式的结果是true还是false,如果是true则执行代码块,如果是false,大括号中的代码是不执行的
例子:
1.如果18大于16,请输出8,如果一个数字大于另一个数字则输出大的数字
2.问:阿珊的年龄是否大于18岁,如果是成年的,则提示,可以打代码了
if(18>16){console.log(18);}//例子1:var num1=10;var num2=100;if(num1>num2){console.log(num1);}????console.log("我执行了");//例子2var age = 19;if (age >= 18) {??console.log("可以打代码了");} else {??console.log("打什么代码，浪起来")}
理解：if-else 语句：两个分支,只能执行一个分支
语法如下：
if(表达式){?????//?代码1}else{???? //?代码2??}
执行过程：如果表达式的结果是true则执行代码1,如果表达式的结果是false,则执行代码2
举一些例子:
//定义变量,并初始化var age = 100;//判断if (age >= 18) {??console.log("可以看电影了,嘎嘎...");} else {console.log("看什么看,回家写作业去");}//提示用户请输入年龄----var age=prompt("请您输入您的年龄");//弹框---并且有输入,输入的内容在age变量中console.log(age);//最终的结果是字符串的类型//案例1:var age = parseInt(prompt("请您输入年龄"));//判断if (age >= 18) {console.log("可以看电影了,嘎嘎...");} else {console.log("看什么看,回家写作业去");}//练习1:找到两个数字中的最大值var num1=10;var num2=20;if(num1>num2){console.log(num1);}else{console.log(num2);}//练习2:判断这个数字是奇数还是偶数var number=parseInt(prompt("请输入一个数字"));if(number%2==0){console.log("偶数");}else{console.log("奇数");}
语法:
var 变量=表达式1?表达式2:表达式3;执行过程:表达式1的结果是true还是false,如果是true则执行表达式2,然后把结果给变量
如果表达式1的结果是false,则执行表达式3,把结果给变量
//两个数字中的最大值var x = 10;var y = 20;var result1 = x > y ? x : y;console.log(result1);?//显示成年还是未成年var age = 10;var result2 = age >= 18 ? "成年了" : "未成年";console.log(result2);
总结:大多数情况,使用if-else的语句都可以用三元表达式的方式来表示
if语句只有一个分支
if-else语句有两个分支,最终执行一个分支
if-else if-else if-else if-else if…else—多分支,最终也是执行一个
if-else if语句…
语法:
if(表达式1){代码1}elseif(表达式2){代码2}elseif(表达式3){代码3}else{代码4???}
else if—这种结构可以写多个,具体多少个看需求,
else–结构是可以不用写的,具体也是看需求
执行过程:
先判断表达式1的结果,
如果为true则执行代码1
如果为false,则判断表达式2
如果表达式2为true则执行代码2
如果为false,则判断表达式3
如果表达式3为true则执行代码3
否则执行代码4
例子: 成绩的结果是在90到100(包含)之间则 显示A级
如果成绩是在80到90(包含)之间,则显示B级
如果成绩是在70到80(包含)之间,则显示C级
如果成绩是在60(包含)到70(包含)之间,则显示D级
如果成绩在0到60(不包含)之间,则显示E级
var score=parseInt(prompt("请你输入成绩"));//有bugif(!isNaN(score)&&!(score>100&&score<0)){//如果为true，说明不是数字console.log("输入不规范，请重新输入")if(score>90&&score<100){console.log("a级")}else if(score>80&&score<90){console.log("b级")}else if(score>70&&score<80){console.log("c级")}else if(score>=60&&score<70){console.log("d级");}else{console.log("e级")}????}????//?或者可以这么写var?score?=?Number(prompt("请您输入成绩"));//有bugif (!isNaN(score)) {//如果为true就说明 不是数字if (score > 90 && score <= 100) {console.log("A级");} else if (score > 80) {console.log("B级");} else if (score > 70) {console.log("C级");} else if (score >= 60) {console.log("D级");} else {console.log("E级");}} else {console.log("您输入有误");}?
练习:判断一个年份是不是闰年
定义变量存储一个年份
var year=Number(prompt("请您输入年份"))if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {console.log("闰年");}else{console.log("平年");}
switch-case语句—分支语句—多分支语句
语法:
switch(表达式){case 值1:代码1;break;case 值2:代码2;break;case 值3:代码3;break;case 值4:代码4;break;...多个casedefault:代码5;
注意问题:
default后面的break是可以省略的
default也可以省略
switch-case 语句中和case后面的值比较的时候使用的是严格的模式
break是可以省略
执行过程:
获取表达式的值,和值1比较,如果一样,则执行代码1,遇到break则跳出整个的语句,
后面代码不执行
如果表达式的值和值1不一样,则和值2比较,如果相同则执行代码2,
遇到break则跳出
否则和值3比较,相同则执行代码3,遇到break,跳出,
否则和值4比较,相同则执行代码4,遇到break则跳出,否则直接执行代码5
例子:获取一个人的成绩的级别,如果是A级则显示90到100直接的分数
如果是B级则显示80到90分
如果是C级则显示70到80之间分数
如果是D级则显示60到70分之间
否则显示0到59之间
var jiBie=prompt("请输入级别");switch(jiBie){case"a":console.log("90-100");break;case"b":console.log("80-90");break;case"c":console.log("70-80");break;case"d":console.log("60-70");break;default:console.log("0-59");//break;(可以省略)}??varjiBie = "E";switch(jiBie) {case "A":console.log("90到100之间");break;case "B":console.log("80到90之间");break;case "C":console.log("70到80之间");break;case "D":console.log("60到70之间");break;default :console.log("0到59之间");?}
根据月份显示对应的天数
var mouth=parseInt(prompt("请输入月份"));switch(mouth){case 1:case 3:case 5:case 7:case 8:case 10:case 12:console.log("31");break;?case 2:console.log("28");break;?case 4:case 6:case 9:case 11:console.log("30");break;}//?1,3,5,7,8,10,12?—31天// 2----28天// 4,6,9,11----30var month=parseInt(prompt("请输入月份"));switch (month){case 1:console.log("31天");break;case 2:console.log("28天");break;case 3:console.log("31天");break;case 4:console.log("30天");break;case 5:console.log("31天");break;case 6:console.log("30天");break;case 7:console.log("31天");break;case 8:console.log("31天");break;case 9:console.log("30天");break;case 10:console.log("31天");break;case 11:console.log("30天");break;case 12:console.log("31天");break;?}???// 练习:根据数字显示对应的星期var num = parseInt(prompt("请输入一个星期的数字"));switch (num) {case 1: console.log("day1"); break;case 2: console.log("day2"); break;case 3: console.log("day3"); break;case 4: console.log("day4"); break;case 5: console.log("day5"); break;case 6: console.log("day6"); break;case 7: console.log("day7"); break;default: console.log("输入有误");}?
分支语句:
if语句:一个分支
if-else语句:两个分支,最终只执行一个分支
if-else if-else if…语句: 多个分支,也是只会执行一个
switch-case语句:多分支语句,最终也会一个(必须要有break)
三元表达式:和if-else语句是一样的
什么时候使用if-else if…: 一般是对范围的判断
什么时候使用switch-case语句:一般是对具体的值的判断
如果有多个分支,是针对范围的判断一般选择if-else if的语句
如果有多个分支,是针对具体的值判断,一般选择用switch-case语句
循环:一件事不停的或者是重复的做
循环要有结束的条件,循环还应该有计数器(记录循环的次数的
while循环
while循环语法:
计数器var 变量=0;while(循环的条件){循环体;计数器++;}
执行过程:
先判断条件是否成立,(条件的结果是true还是false),如果是false,
那么循环的代码(while的大括号中的代码都不执行),如果是true,
那么先执行循环体,然后执行计数器,然后,直接去—>循环的条件,
再次判断是否成立,成立则继续执行循环体,否则跳出循环,执行完循环体之后,
计数器加1,然后再去循环的条件,判断,成立则循环,否则跳出循环
练习:
// 计算1-100之间所有数字的和var sum=0;var i=0;while(i<=100){//sum=sum+i;sum+=i;i++}console.log("和为："+sum)?var sum=0;while(i<10){console.log("和为："+sum)sum+=i;}??var sum=0;//存储最终的和var i=1;//计数器while(i<=100){//sum=sum+i;//不停的计算数字的和sum+=i;i++;}console.log("和为:"+sum);??var sum=0;//存储最终的和var i=0;//计数器while(i<=5){//sum=sum+i;//不停的计算数字的和sum+=i;i++;}console.log("和为:"+sum);?// 求6的阶乘:var ji = 1;//存储最终的阶乘的结果var i = 1;//开始的数字while (i <= 6) {ji *= i;i++;}console.log(ji)var ji = 1;//存储最终的阶乘的结果var i = 1;//开始的数字while (i <= 6) {ji *= i;i++;}?console.log(ji);?求1-100之间所有的偶数的和var i=1;//计数器var sum=0;//存储所有数字的和//判断这个数字是不是奇数,如果是奇数则相加,把结果存放在sum变量中while(i<=100){if(i%2!=0){sum+=i;}i++;//为了不变成死循环}console.log(sum)?求1-100之间所有的奇数的和var i = 1;//计数器var sum = 0;//存储和的while (i <= 100) {if (i % 2 != 0) {sum += i;}i++;}console.log(sum);// 请输出1-100之间所有能够被7整除的数字var i = 0;while (i <= 100) {if (i % 7 == 0) {console.log(i);}i++;}?var i=1;while(i<=100){//判断这个数字是否能够被7整除if(i%7==0){console.log(i);}i++;}?//求帐号和密码是否一致,登录的效果实现//提示用户输入帐号//提示用户输入密码//如果帐号或者密码不对,则一直提示用户输入帐号和密码//帐号–admin//密码–123—字符串类型var userName=prompt("请输入帐号");var userPwd=prompt("请输入密码");while(userName!="admin"||userPwd!="123"){userName=prompt("请输入帐号");userPwd=prompt("请输入密码");}?console.log("登录成功")
语法:
do{循环体}while(条件);
执行过程:
先执行一次循环体,然后判断条件是否成立,不成立,
则跳出循环,成立则执行循环体,然后再判断条件是否成立,成立则继续循环,否则跳出…
输出:阿珊要睡觉了…10次
var?i=0;do{console.log("阿珊要睡觉了")i++;}while(i<10);//注意：分号一定要下?// 练习:求100以内所有3的倍数的和?//方法1：var i = 1;var sum = 0;while (i <= 100) {if (i % 3 == 0) {sum += i;}i++;}console.log(sum)?//方法2var i = 1;var sum = 0;do {if (i % 3 == 0) {sum += i;}i++;} while (i <= 100);????console.log(sum)
while循环特点:先判断,后循环,有可能一次循环体都不执行
do-while循环特点:先循环,后判断,至少执行一次循环体
for(表达式1;表达式2;表达式3){循环体;}
执行过程:
先执行一次表达式1,然后判断表达式2;如果不成立则直接跳出循环
如果表达式2成立,执行循环体的代码,结束后,跳到表达式3执行,然后跳到表达式2,判断表达式2是否成立,不成立,则跳出循环
如果表达式2成立,则执行循环体,然后再跳到表达式3,再跳到表达式2,判断是否成立,一直如此
csfor(var?//例子:打印10次,哈哈,我又变帅了for (var i = 0; i < 10; i++) {console.log("日照香炉生紫烟,一对情侣在林间.远看身影如神仙,近看竟然是于千");}?//求1-100之间所有数字的和?var sum = 0;for (var i = 1; i <= 100; i++) {sum += i;}console.log("和为:" + sum);??// for (var i = 0; i < 10; i++) {// console.log("小杨好帅");// }for(var i=0;i<10;i++){console.log("love")//求1-100之间所有偶数的和?var sum=0;for(var i=0;i<=100;i++){if(i%2==0){sum+=i;}}console.log(sum)?// 求1-100之间所有奇数的和var sum=0;for(var i=0;i<=10;i++){if(i%2!=0){sum+=i;}}console.log(sum)//?求1-100之间所有能被3整除的数字的和var sum=0;for(var i=1;i<100;i++){if(i%3==0){sum+=i;}}console.log(sum)// 求1-100之间所有能被7整除的数字的和var sum=0;for(var i=1;i<=100;i++){if(i%7==0){sum+=i;}}console.log(sum)//画星星?for(var i=0;i<=5;i++){for(var j=0;j<=i;j++){document.write("?")}document.write("<br/>")}//控制行数的---正方形的for (var i = 0; i <= 5; i++) {//控制每一行有几个星星for (var j = 0; j <= 5; j++) {document.write("★");}document.write("<br/>");}?//// for(var j=0;j<=2;j++){// document.write("★");// }三角形的—五角星----随着行数的增加,每一行都会比上一行多一个五角星?for (var i = 0; i <= 5; i++) {//控制每一行有几个星星for (var j = 0; j <= i; j++) {document.write("★");}document.write("<br/>");}// 乘法口诀表for(var i=1;i<=9;i++){//控制每一行有多少个表达式for(var j=1;j<=9;j++){document.write(j+"*"+i+"="+i*j);}document.write("<br/>");}?for(var i=1;i<=9;i++){//控制个数for(var j=1;j<=i;j++){document.write(j+"*"+i+"="+i*j)}document.write("<br/>") }
