17js流程控制switch
<!DOCTYPE html>
<html>
<head>
<title>17js流程控制switch</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body>
</body>
<script>
//js流程控制switch
/*格式：
switch(条件){
case 1:
语句1；
break;
case 2:
语句2；
break;
case n:
语句n;
break;
defaul:
其他情况；
break;
}
*/
var num = 3;
switch (num){
case 1:
document.write("壹");
break;
case 2:
document.write("贰");
break;
case 3:
document.write("叁");
break;
case 4:
document.write("肆");
break;
default:
document.write("捌");
break;
}
/*注意事项
case是一定要全等于。case 值 === JavaScript 中case判断是否相等时是全等于(===),而不是等于(==)。
也就是说既会判断类型是否相等又会判断值是否相等。
*/
var str = "1";
switch (str){
case 1: //为什么不是这里。
document.write("<br/>我是壹");
break;
case 2:
document.write("<br/>我是贰");
break;
default: //因为一个是数字一个是字符串所以不能是第一个。switch一定要全等于。
document.write("<br/>我是其他的数");
break;
}
var str = "123";
switch(str){
case 123:
document.write("<br/>我是数字123");
break;
case "123":
document.write("<br/>我是字符串123");
break;
default:
document.write("<br/>我是其他的数字");
break;
}
// case 后可以是常量和变量。
var str = 123;
var num = 123;
var str1 = "123";
switch(str){
case num:
document.write("<br/>我是数字123");
break;
case str1:
document.write("<br/>我是字符串123");
break;
default:
document.write("<br/>我是其他的数字");
break;
}
//表达式判断问题 判断时会先计算表达式的值，再判断。
var str = 123 + 10;
var num = 123;
var str1 = "123";
switch(str){
case 10 + 123:
document.write("<br/>我是数字10+123");
break;
case "123 + 10":
document.write("<br/>我是字符串123+10");
break;
default:
document.write("<br/>我是其他的数字");
break;
}
/*case 的穿透问题。
switch里面的case只要匹配一次其它的都会失效，包括default.
在case语句最后增加break语句，使每一次执行之后均可跳出switch语句，从而避免输出不应有的结果。
*/
var str = "123";
switch(str){
case 123:
document.write("<br/>我是数字123");
break;
case "123":
document.write("<br/>我是字符串123");//缺少了break;就会继续执行。下面的把结果全部输出。
default:
document.write("<br/>我是其他的数字<br/>");
break;
}
//default 的位置问题
var str = "123";
switch(str){
case 123:
document.write("<br/>我是数字123");
break;
default:
document.write("<br/>我是其他的数字");
break;
case "1231":
document.write("<br/>我是字符串123");//缺少了break;就会继续执行。下面的把结果全部输出。
break;
}
</script>
</html>
18js流程控制if和switch的转换
<!DOCTYPE html>
<html>
<head>
<title>18js流程控制if和switch的转换</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body>
</body>
<script type="text/html">
/*js流程控制if 和switch 的转换
题目：
利用if实现
利用switch实现
*/
//要求用户输入一个分数，根据输入的分数输出对应的等级。A:90-100;B:80-89;C:70-79;D:60-69,E:0-59
//1、if
/*//1.1、定义变量，契文存放分数。
var score;
//1.2、提示用户输入分数
score = Number(prompt("请输入0-100之间的分数","0"));
//1.3、根据分数判断等级
if((0<score)&&(100<score)){
alert("你输入有误，请重新输入0-100之间的分数\n");
}else if((90<=score)&&(100>=score)){
document.write("你的分数是A");
}else if((80<=score)&&(89>=score)){
document.write("你的分数是B");
}else if((70<=score)&&(79>=score)){
document.write("你的分数是C");
}else if((60<=score)&&(69>=score)){
document.write("你的分数是D");
}else{
document.write("你的分数是E");
}
//js流程控制if 和switch 的选择
*/
/*
//获取用户输入的信息
var score = prompt("请输入一个分数");
var result;
//针对用户的不同操作，进行相应的数据过滤
if(score == ""){
alert("对不起，你没有输入任何分数！");
}else if(score == null){
alert("你已经取消操作了");
}else if(Number(score)!=score) {
//判断输入的不是数值
alert("对不起，必须输入数值的分数");
}else if(score>100 || score<0){
alert("对不起，你输入的分数必须介于0-100之间");
}else{
//根据用户不同的分数，来输出不同的评语
if(score>=90){
result = "优秀";
}else if(score>=80){
result = "良好";
}else if(score>=70){
result = "中等";
}else if(score>=60){
result = "及格";
}else{
result = "不及格";
}
}
document.write(result);
*/
//2、switch
//2.1、定义变量，契文存放分数。
var score; // 100/10 =10 90/10 =9 ......0/10 =0 ;
//2.2、提示用户输入分数
score = Number(prompt("请输入0-100之间的分数","0"));
var level =Math.floor(score /10); // Math.floor 取整。
switch (level){
case 10:
case 9:
document.write("你的成绩等级为A");
break;
case 8:
document.write("你的成绩等级为B");
break;
case 7:
document.write("你的成绩等级为C");
break;
case 6:
document.write("你的成绩等级为D");
break;
case 5:
case 4:
case 3:
case 2:
case 1:
case 0:
document.write("你的成绩等级为E");
break;
default:
alert("你输入的有误");
break;
}
//if语句和switch语句选择 if 一般用于大范围，switch 一般用于小范围。
/*
分支比较多且无法穷尽时最好用 if，其它情况可以视情况而定
如果数据量不是很大，并且数据是固定的可以用switch理论上switch的效率比if高。
Switch弊端：判断用户输入的数是否大于100.
*/
</script>
<script type="text/html">
//1、从键盘输入一个月份，输出对应季节 12--2 冬季 3--5 春季 6－8 夏季 9--11 秋季。
//1、定义变量 month
var month;
//2、接收数据
month = +(prompt("请输入月份：值：1-12"));
//3、数据安全校验
if(isNaN(month)){
alert("输入有误")
}else{
//4、判断输出
switch(month){
case 1:
case 2:
case 12:
document.write("这是冬季");
break;
case 3:
case 4:
case 5:
document.write("这是春季");
break;
case 6:
case 7:
case 8:
document.write("这是夏季");
break;
case 9:
case 10:
case 11:
document.write("这是秋季");
break;
default:
alert("你输入的月份有误");
break;
}
}
</script>
<script>
//2、使用Switch实现简单的计算器
//1、定义变量
var num1,num2,op,result;
//2、接收数据
num1 = +(prompt("请输入第一个数值"));
//3、较验数据
if(isNaN(num1)){
alert("你的输入第一个数值有误。");
}else{
op = prompt("请输入对应的运算符 +(加) -(减) *(乘) /(除) ");
if(op!="+" && op!="-" && op!="*" && op!="/"){
alert("你输入的运算符有误");
}else{
num2 = +(prompt("请输入第二个数值"));
if(isNaN(num2)){
alert("你的输入第二个数值有误。");
}else{
//4、输出结果
switch(op){
case "+":
result = num1 + num2;
break;
case "-":
result = num1 - num2;
break;
case "*":
result = num1 * num2;
break;
case "/":
result = num1 / num2;
break;
default:
document.write("计算有误，无法计算。")
break;
}
alert("你输入的运算结果是:" + result);
}
}
}
</script>
</html>
19js流程控制中循环
<!DOCTYPE html>
<html>
<head>
<title>19js流程控制中循环</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body>
</body>
<script type="text/html">
//循环
//循环结构是程序中一种很重要的结构。其特点是在给定条件成立时，反复执行某程序段，直到条件不成立为止。
//1、给定的条件称为循环条件，反复执行的程序段称为循环体
//2、循环结构简单来说就是：一次又一次的执行相同的代码块。
//现实生活中的循环
//JavaScript中的循环
//while 语句
//
/*while 格式：
while(条件表达式){ //直到条件不成立到跳出。
语句1；
语句2；
......
}
*/
//执行流程
/*
判断条件表达式是否为真，如果为真执行后面大括号中的内容。
执行完毕再次判断条件表达式是否还为真，如果为真执行后面大括号中的内容。
重复上述过程，直到条件不成立就结束while循环。
*/
//while 循环特点：
/*
如果while中的条件一开始就不成立，那么循环体中的语句永远不会被执行。
*/
var j = 10 ;
while(j<10){
alert("我是最帅。")
j++;
}
//while 循环注意点
/*
1、死循环
2、任何值都有真假性
3、while后如果只有一条语句它可以省略大括号
4、分号问题
5、最简单的死
*/
/*
var x = 10 ;
while(x<20){
//alert("我是最帅。")
x--; //死循环了。
}
*/
//1、提示用户输入一个正整数n,计算1+2+3+...+n的和。
//1、定义变量
var n,sum;
sum=0;
//2、接收输入的数值。
n = +(prompt("请输入一个正整数值"));
//3、while计算
while(n>=0){
sum = sum + n;
n--;
}
document.write(sum);
</script>
<script>
//2、获取1--100之间7的位数的个数，并打印，并统计个数。
var j = 100, i;
i=0;
while(j>0){
if(j%7==0){
document.write( j + " ");
i++;
}
j--;
}
document.write("统计个数是:"+i);
</script>
</html>
20js流程控制break-continue
<!DOCTYPE html>
<html>
<head>
<title>20js流程控制break-continue</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body>
</body>
<script>
//break 关键字的作用。
//1、跳出switch语句
/*
var num;
num =+(prompt("请输入一个 1－12 月份"));
switch (num){
case 12:
case 1:
case 2:
alert("你输入的是冬季");
break; //找到符合条件的情况就跳出。
case 3:
case 4:
case 5:
alert("你输入的是春季");
break;
case 6:
case 7:
case 8:
alert("你输入的是夏季");
break;
case 9:
case 10:
case 11:
alert("你输入的是秋季");
break;
default:
alert("你输入的我也不知什么季节了。");
break;
}*/
//2、跳出循环语句
/*
var sum=0;
while(true){
console.log(sum);
if(10===sum){
break;
}
sum++;
}
*/
//注意点
//1、break 关键字只能用于循环语句和switch语句，在其他地方没有意义。
//break;
/*if(true){
break;
alert("我会输出么？");
}*/
//以上写法都是错的。
//2、在多层循环中，一个break语句只向外跳一层。
/*
var n=1;
while(n<10){
while(2){
console.log("我是while2");
break; //跳出while2,但是不会跳出while1
}
console.log("我是while1");
n++;
}
//3、break 后面的语句是永远不会执行到。
while(1){
break;
alert("我是否可以弹出。");
}
*/
//continue 关键字
//1、作用 ：跳过当前循环体中剩余的语句而继续下一次。
var n=0;
while(n<10){
n++;
if(n%2===0){
continue; //结束本次循环，进入下一次循环
}
document.write(n+"<br/>");
}
//2、注意点
//1、只能用于循环结构，在其它地方没有意义。
//2、continue 后面的语句是永远不会被执行。
</script>
</html>
21js流程控制循环do while
<!DOCTYPE html>
<html>
<head>
<title>21js流程控制循环do while</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body>
</body>
<script>
//循环 do while
/*
1.do-while循环在循环的最后检查条件
2.这就意味着do-while循环能保证至少循环能执行一次
3.总的来说,do-while循环是用来给用户展示一个菜单用的
*/
/* 格式：
do{
语句1;
语句2;
......
}while(条件); 条件成立就执行。
*/
/* 执行流程
首先会执行一次循环体中的语句。
接着判断while中的条件表达式是否为真，如果为真再次执行循环体中的语句。
重复上述过程，直到条件不成立就结束while循环。
*/
var num =1,i=0;
do{
i++
console.log("我可以输出"+ i +"次");
num++;
}while(num<10);
var j=20,i=0;
do{
i++;
console.log("我可以输出"+ i +"次");
j++;
}while(j<10);
/* 特点：不管while中的条件是否成立，循环体中的语句至少会执行一遍。*/
/* 应用场景：口令校验*/
</script>
</html>
22js流程控制循环for
<!DOCTYPE html>
<html>
<head>
<title>22js流程控制循环for</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body>
</body>
<script type="text/html">
//for 循环
/* JavaScript 中的for语句使用最为灵活，不仅可以用于循环次数已经确定的情况，而且可以用于循环次数不确定而只给出循环结束条件的情况，它完全可以代替while语句。
*/
/* 格式
for(①初始化表达式;②循环条件表达式;④循环后操作表达式){
③执行语句;
}
*/
/* for循环执行流程
for循环开始时，会先执行初始化表达式，而且在整个循环过程中只执行一次初始化表达式
接着判断循环条件表达式是否为真，如果条件为真，就会执行循环体中的语句
循环体执行完毕后，接下来会执行循环后操作表达式
执行完循环后操作表达式，然后再次判断循环条件表达式是否为真，如果条件为真，就会执行循环体中的语句。
重复上述过程，直到条件不成立就结束for循环。
*/
for(var i=1;i<10;i++){
document.write(i+" ");
}
document.write("<br/>")
//for循环和while 循环如何选择？
//一般情况下while和for可以互换，但是如果循环执行完毕之后就不需要使用用于控制循环的增量，那么用for更好。
//输出相应的数的奇数。
var num = +(prompt("请输入一个正整数"));
for(var j=1; j<num; j++){
if(j%2===0){
continue;
}
document.write(j +" ");
}
document.write("<br/>")
var z=0;
while(z<num){
z++;
if(z%2===0){
continue;
}
document.write(z +" ");
}
/* 注意点
for循环中初始化表达式，循环条件表达式，循环后操作表达式都可以不写
for(;;){} 和 while(1){} 可以用，但是这种是死循环。
*/
</script>
<script type="text/html">
//循环嵌套练习
//1、打印好友列表
/* 好友列表1
好友1
好友2
好友3
好友列表2
好友1
好友2
好友3
*/
for(var i=1; i<3; i++){
document.write("好友列表"+ i +"<br/>");
for(var j=1; j<4;j++){
document.write(" 好友"+j +"<br/>");
}
}
</script>
<script type="text/html">
//for循环嵌套实现矩形绘制
/* 需求:在界面上绘制如下图形
**********
* *
* *
* *
**********
1、外循环控制行数。
2、内循环控制个数。
*/
for(var i=1; i<6;i++){
if(i==1 || i==5){
for(var j=1;j<11;j++){
document.write("*")
}
}else{
for(var j=1;j<3;j++){
document.write("*") //设置输出位置
}
}
document.write("<br/>")
}
</script>
<script type="text/html">
//3、for循环嵌套实现三角形绘制。
/*
*
**
***
****
*****
******
*/
for(var i=0; i<8; i++){
for(j=0;j<i;j++){
document.write("*");
}
document.write("<br/>");
}
</script>
<script type="text/html">
//for循环嵌套实现三角形倒绘制
for(var i=0; i<8; i++){
for(var j=i; j<8; j++){
document.write("* \t");
}
document.write("<br/>");
}
</script>
<script type="text/html">
//for循环嵌套实现打印特殊三角形
for(var i=1; i<7; i++){
for(var j=1;j<=i;j++){
document.write(j +"\t");
}
document.write("<br/>")
}
</script>
<script type="text/html">
//for循环嵌套实现打印正三角形
for(var i=0; i<=5; i++){
for(var j=0; j<5-i; j++){
document.write("-\t");
}
for(var n=1; n<=2*i+1; n++){
document.write("* \t");
}
document.write("<br/>");
}
</script>
<script>
//for循环嵌套实现打印99乘法表
for(i=1; i<=9; i++){
for(j=1;j<=i;j++){
document.write(j+"x"+i+"="+i*j + " ");
}
document.write("<br/>")
}
</script>
<script>
//for循环嵌套实现打印99乘法表
for(var i=1; i<=9; i++){
for(var j=1; j<=9-i; j++){
document.write("--------");
}
for(var n=1; n<=i; n++){
document.write(n+"x"+i+"="+n*i +" ")
}
document.write("<br/>")
}
</script>
</html>
