js三大结构：顺序结构，选择结构，循环结构

客官°小女子只卖身不卖艺 2022-03-15 04:44 385阅读 0赞

js中有三种结构：顺序结构，选择结构，循环结构

# 一、顺序结构 #

顺序结构表示程序中的各操作是按照它们出现的先后顺序执行的。

# 二、选择结构 #

选择结构表示程序的处理步骤出现了分支，它需要根据某一特定的条件选择其中的一个分支执行。选择结构有单选择、双选择和多选择三种形式。

## 1、if-else结构 ##

### 单分支结构     ###

if(判断条件)\{

### 双分支结构     ###

if(判断条件)\{

else\{

### 多分支结构 ###

if(判断条件)\{

else if()\{

else\{

## 2.switch-case结构 ##

switch(判断条件){
        case 表达式1:
            代码;
            break;
        case 表达式2:
            代码;
            break；
        case 表达式3：
            代码;
            break;
        .......
        default:代码
    }

### 案例：用switch结构判断学生成绩 ###

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            .box{
                width: 350px;
                height: 300px;
                background-color: deeppink;
                margin: 100px auto;
                line-height: 300px;
                text-align: center;
            }
        </style>
    </head>
    <body>
    <div class="box">
        
        请输入您的分数：<input  id='score' type="search" placeholder="1--100分">
     
    </div>
    <script>
        /*
        * 按照学生的分数划分等级：
        * <60  等级：F
        * 60-70  D
        * 70-80  C
        * 80-90   B
        * 90-100   A
        * */
     
        /*
        * 1.获取input结点    通过id名字去获取元素
        * document.getElementById("id名字")
        * 2.用户的输入值  表单元素的值   对象.value
        * 事件函数：    鼠标事件，  单击  双击
        *                键盘事件，按得那个键
        *                表单   元素    聚焦 onfocus  离焦onblur
        * 3.判断值到底是属于哪一个等级
        * */
        var stuInput=document.getElementById('score');
        /*获取input控件里用户输入的值*/
     
        /*离焦事件如果用户在文本框离焦了，就执行{}里面的内容 通过离焦获取学生分数*/
        stuInput.onblur=function(){
            console.log(stuInput.value);
            /*把获取回来的用户输入值转换为数值*/
            var score=parseInt(stuInput.value);
            /*Math.floor(4.5)  向下取整  4
            * Math.round(4.5)   向上取整   5
            * */
            switch(Math.floor(score/10)){
                case 10:
                    alert('满分 A');
                    break;
                case 9:
                    alert('A');
                    break;
                case 8:
                    alert('B');
                    break;
                case 7:
                    alert('C');
                    break;
                case 6:
                    alert('D');
                    break;
     
                default :alert('不及格')
            }
     
        }
     
    </script>
    </body>
    </html>

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDIzOTU0MQ_size_16_color_FFFFFF_t_70][]

# 三、循环结构 #

循环结构表示程序反复执行某个或某些操作，直到某条件为假(或为真)时才可终止循环。在循环结构中最主要的是：什么情况下执行循环?哪些操作需要循环执行?

循环基本结构有三种表示方式

## 1、for循环 ##

三要素：循环变量赋 初值  
            循环控制条件（出口） -->数组下标越界的判断  
          增量 步长 （i++ i--）  
      for( 赋初值1;控制条件2 ;步长3 )\{  
        循环体4

执行过程是： 1,--》2 --》4 --》3 --》2--》4--》3--》2--》4......

### 案例1：求1到100之间的和 ###

var sum=0;
    for(var i=0;i<=100;i++){
        sum+=i;
    }
    document.write(sum);

### 案例2：求1到100之间奇数的和 ###

var sum=0;
    for(var i=0;i<=100;i++){
        if(i%2==1){
            sum+=i;
        }
    }
    document.write(sum);

### 案例3：求n的阶乘 即n!=n\*(n-1)\*(n-2)\*.....\*1 ###

var mul=1;
    var n=10;
    for(var i=1;i<=n;i++){
        mul*=i;
    }
    document.write(mul);

### 案例4：查找列表中的值 ###

折半查找：有序  内存有序  
顺序查找：有序或者无序

如果找到  查找成功  在哪位置  
没找到    查找失败

![20190228112943948.png][]

## 2、while循环 ##

1.赋初值  
    while(2控制条件)\{  
      循环体4  
      增量3

执行过程：2--》4--》3--》2--》4......

### 案例：通过while循环求1到100之间的和 ###

var i =1
    var sum = 0
    while(i<100){
      sum *+ = i
      i++
    }

### for循环与while循环之间的区别 ###

for() 循环次数明确 
    while()  循环次数不明确的情况下 
    while() { 循环体}  循环体有可能一次都不执行

## 3、do while 循环 ##

do\{  
    循环体；  
  \}while（判断条件）先执行后判断 至少执行一次循环体

### do while 与 while 之间的区别 ###

通过玩游戏之后选择是是否继续为例

do\{  
    玩游戏  
  \}while(是否接着玩？y/n)

do while 循环是玩家先玩完游戏之后再选择是否继续，简而言之，就是先执行在判断，合乎逻辑

while(你是否愿意接着玩游戏？y/n)\{玩游戏\}  \#\#\#不合理

while 循环是直接问玩家是否继续玩游戏，然后才能玩游戏，简而言之，就是先判断玩家是否继续，才能决定是否执行玩游戏这个过程，对于玩家来说就是不合理的了

## 循环嵌套结构 ##

通过冒泡排序来简单介绍一下循环嵌套结构

冒泡排序（BubbleSort）：思想：相邻元素进行比较，如果逆序则交换，大的沉底，小的上浮

稳定排序 适用场合：基本有序 冒泡+优化效率很高

稳定排序：相同关键字在排序前后相对位置不变

案例：通过排序实现数组中的数值由小到大有排列

![20190228220035688.png][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDIzOTU0MQ_size_16_color_FFFFFF_t_70]: /images/20220315/7a6fb161f50045bd84a2f3d651e430bd.png
[20190228112943948.png]: /images/20220315/897245d032ff431f849298c747da687f.png
[20190228220035688.png]: /images/20220315/d4b4c984b5ee4242b86944a1801403b7.png