JavaScript 三大结构

编程的三大结构

(1)顺序结构
(2)选择结构
(3)循环结构

j结构图

1.顺序结构

顺序结构的程序设计是最简单的,只要按照解决问题的顺序写出相应的语句就行,它的执行顺序是自上而下,依次执行。不过大多数情况下顺序结构都是作为程序的一部分,与其它结构一起构成一个复杂的程序,例如分支结构中的复合语句、循环结构中的循环体等。

顺序结构

2.选择结构

选择结构用于判断给定的条件,根据判断的结果判断某些条件,根据判断的结果来控制程序的流程。选择结构也称分支结构,就是让程序“拐弯”,有选择性的执行代码;换句话说,可以跳过没用的代码,只执行有用的代码。 程序按照某个条件执行(出口只有一个)。

选择结构

(1) if 选择结构

执行逻辑:对条件进行判断,如果条件返回值为true (满足条件)则执行。
if 语句:只有当指定条件为true (满足条件)时,该语句才会执行代码,在条件为false时执行其他代码。

① if 单分支
语法格式: 

	if (条件为true){
				满足条件需要执行的代码
		} 
	
注意:		
(1)括号内的条件为true时,进入大括号里执行代码;
(2)小括号内的结果若不是布尔类型时,会发生隐式转换转为布尔类型。


// 例如:判断3是否小于6,如果为真就输出"这是真的" 。
 if (3 < 6) {
           alert('这是真的');
        }
② if 双分支
语法格式:

		if(条件){ 
				满足条件要执行的代码
		} else { 
		不满足条件执行的代码 
		}
		
注意:
(1)双分支语句是两个互斥条件(两个条件一定会满足一个,不会同时满足,也不会同时不满足);2if 大括号代码 和 else大括号代码 一定会执行一个,不会同时执行,也不会同时不执行。


// 例如:输入一个年份,判断输入的年份是闰年还是平年。
    let year = +prompt('请输入年份:');
        if (year % 4 === 0 && year % 100 === 0 || year % 400 === 0) {
            alert(`${year}年是闰年`);
        }
        else {
            alert(`${year}年是平年`);
        }
③ 多个 if 语句
语法格式:

     if(条件1){
 		  需要执行的代码
     }
     if(条件2){
 		  需要执行的代码
     }
     if(条件3){
 		  需要执行的代码
     }

注意:
(1)所有的条件都会进行判断,无论是否满足条件都会向下执行,直到程序结束;
(2)由于if都会执行一遍,则可能会同一个需要判断的事件,会进入2if语句中,出现错误。
(3)这个语句并不常用,了解下就行。


// 例如:输入一个数字判断是否满足条件输出
	let a = 12;
        if (a > 10) {
            document.write(`a大于10`)
        }
        if (a > 5) {
            document.write(`a大于5`)
        }
④ 多分支 else if
语法格式:

    if(条件1){
          	条件1成立时需要执行的代码
      }else if(条件2){
    		条件2成立时需要执行的代码
      }else if(条件3){
    		条件3成立时需要执行的代码
	 }
    .....
  	else{
    	    如果前面所有条件都不满足,则执行else代码
 	}
 	
注意:
 (1) 多分支所有的大括号代码最多只会执行一个,只有当前面的条件不满足,才会进入后面的条件判断;
 (2) 多分支一定要以if开头,后面else if可以多个,结尾else可以省略。


//例如:根据输入不同时间,输出不同的问候语。
    let time = +prompt('请输入时间:');
        if (time > 0 && time <= 12) {
            document.write('上午好');
        } else if (time > 12 && time <= 18) {
            document.write('下午好');
        } else if (time > 18 && time <= 20) {
            document.write('晚上好');
        } else {
            document.write('夜深了');
        }
④ 嵌套if
语法格式:
	if (表达式)
   {
      if (表达式)
       语句1;
      else if (表达式)
       语句2;
      else if (表达式)
       语句3;
      else
       语句4;
   }
   else if (表达式)
   {
     if (表达式)
       语句1;
     else if (表达式)
       语句2;
     else if (表达式)
       语句3;
   }
   else
   {
     if (表达式)
       语句1;
     else if (表达式)
       语句2;
     else if (表达式)
       语句3;
     else
       语句4;
   }

注意:
(1)只有一条语句时if后面的大括号可以省略;
(2if else是一个整体,当 if else后面的大括号被省略时,else会自动和距离最近的一个 if 匹配;
(3) 分号 ; 也是一条语句, 空语句;4) 非Boolean类型的值,会先转换为Boolean类型后再判断。


// 例如:判断成绩是否达到三好学生标准。
      let chinese = +prompt(`请输入语文成绩:`);
        if (chinese == 100) {
            let math = +prompt(`请输入数学成绩:`);
            if (math == 100) {
                let english = +prompt(`请输入英语成绩:`);
                if (english == 100) {
                    alert(`恭喜你获得三好学生称号`);
                }
                else {
                    alert(`不是三好学生`);
                }
            }
            else {
                alert(`不是三好学生`);
            }
        }
        else {
            alert(`不是三好学生`);
        }
(2)switch 选择结构

原理:
① 每计算一次 switch 表达式,会把得到的值与每个 case 的值进行对比,如果匹配就会执行相关的代码。
② break语句则会跳出switch,一旦遇到它,那么它后面的语句都不会执行。
③ break语句可以节省一些时间,如果没有break语句则会一直执行到最后。
④ default :不存在 case 匹配时所执行的代码。

注意:
① switch case语句一般用于等值判断,不适合于区间判断。
② switch case一般需要配合break关键字使用没有break会造成case穿透。
③ case有一个满足条件,后面的将不再判断,直接输出,直到遇到break。
④ default可以放任意地方,但是一般还是放在switch末尾。
⑤ case判断相等,是全等比较。

语法格式:
switch(表达式) {
     case n:
        符合条件执行语句
        break;
     case n:
        符合条件执行语句
        break;
     default:
        默认代码块(都不能匹配以上条件执行的语句)
	  } 


//例如:简单的计算器。
  let num1 = +prompt(`请输入第一个数:`);
  let num2 = +prompt(`请输入第二个数:`);
  let count = prompt(`请输入运算符号:`);
        switch (count) {
            case '+':
                alert(`输出结果为:${num1+num2}`);
                break;
            case '-':
                alert(`输出结果为:${num1-num2}`);
                break;
            case '*':
                alert(`输出结果为:${num1*num2}`);
                break;
            case '/':
                alert(`输出结果为:${num1/num2}`);
                break;
            default:
                alert(`输入有误`);
        }

3.循环结构

循环结构是指在程序中需要反复执行某个功能而设置的一种程序结构。它由循环体中的条件,判断继续执行某个功能还是退出循环。根据判断条件,循环结构又可细分为以下两种形式:先判断后执行的循环结构和先执行后判断的循环结构。循环结构就是让程序“杀个回马枪”,不断地重复执行同一段代码。

循环需要具备的三要素:
(1)变量起始值
(2)终止条件(没有终止条件,循环会一直执行,造成死循环)
(3)变量变化量(用自增或者自减)

循环语句

(1)while 循环
语法格式:

	while(表达式){
		循环语句
	 }
	 
注意:
1、先判断表达式,表达式成立执行循环语句。
2、循环条件中使用的变量(循环变量)需要经过初始化。
3、循环体中,应有结束循环的条件,否则会造成死循环。
4、循环体中,可以写若干JS代码,包括if,也可以再套一个循环。


// 例如:求1-100的和。
  let i = 1;
  let sum = 0;
        while (i <= 100) {
           sum += i;
            i++;
        }
        document.write(sum);
(2)do-while 循环
语法格式:

   do{
      //循环操作
   }while(条件判断);

注意:
(1)特点:先执行,后判断; 至少执行1;2)当不确定要执行循环主体多少次时,可以使用do-while循环语句;3)由于while条件是在循环末尾求值的,因此循环体将至少执行一次。


// 例如:求1-100之间的和。
  let sum = 0;
  let i = 1;
        do {
            sum += i;
            i++;
        } while (i <= 100); 
        //条件表达式也可以写成(i<101)
        document.write("1~100的和为:" + sum);
(3)for 循环
语法格式:

	for (语句 1; 语句 2; 语句 3) {
     			要执行的代码
		}
		
注意:		
(1)语句1在循环开始之前执行;2)语句2判断循环的条件;3)语句3在循环每执行一次后执行。
(4break语句可以中断循环,也就是遇到它后,后面的语句以及循环将不再执行。
(5continue语句是跳过本次循环,也就是本次循环后面的语句不会执行,然而循环不会受影响,不会被中断。

执行顺序:
   1. 初条件;
   2. 条件判断;
   3. 条件为真,执行循环操作;
   4. 条件改变;
   5. 重复2,3,4直到条件为假时,结束循环。


// 例如:打印100–200之间所有能被3或者7整除的数。
  for (let i = 100; i <= 200; i++) {
            if (i % 3 == 0 || i % 7 == 0) {
                console.log(i);
            }
        }

(4)嵌套循环案例
1)假如每天记住5个单词,3天后一共能记住多少单词?
 	for (let i = 1; i < 4; i++) {
            document.write(`${i}天<br>`)
            for (let j = 1; j < 6; j++) {
                document.write(`记住${j}个单词<br>`)
            }
        }2)打印输出五行五列星星。
	for (let i = 1; i < 6; i++) {
            for (let j = 1; j < 6; j++) {
                document.write('*')
            }
            document.write(`<br>`)
        }3)九九乘法表。
  	for (let i = 1; i <= 9; i++) {
            for (let j = 1; j <= i; j++) {
                document.write(j + " * " + i + "=" + i * j + "&nbsp;&nbsp;&nbsp;");
            }
            document.write("<br><br>");
        }

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值