JavaScript程序结构

news2024/9/21 4:26:50

程序结构有三种:选择结构、循环结构 、顺序结构

一、选择结构

1、简介

根据条件进行判断,从而执行不同的操作,称为选择结构(分支结构),其实就是条件判断

选择结构的类型:if、switch

2、if结构

分为:单分支结构、二分支结构、多分支结构、嵌套if结构

 语法:

if(条件1){
    代码块1 
}else if(条件2){
    代码块2
}else if(条件3){
    代码块3
}
...
else{
    代码块n   
}
2.1if语句(单分支结构)

编写代码时,经常需要根据不同的条件执行不同的操作。

您可以通过在代码中使用条件语句来执行此操作。

如果指定的条件为 true,则使用 if 来指定将执行的代码块。

if (条件) {
   //条件为true时要执行的代码
}

只有当指定条件为 true 时,该语句才会执行代码。

var num = 10;
if (num < 20){
  document.write("hello");
}

执行结果: 

 

这是条件为 false 的另一个例子。

var num1 = 7;
var num2 = 10;
if (num1 > num2) {
   alert("num1比num2大");
}
alert("if结构之后的代码,和if结构无关");

当条件为false时,将跳过警报语句,程序继续执行if语句关闭大括号之后的行。

请注意,如果是大写字母(If或IF)将产生错误。

2.2else 语句(二分支结构

使用 else 语句指定一个代码块,如果条件为 false,则执行该代码块。

if (expression) {
   // 条件为 true 时执行
}
else {
   //  条件为 false 时执行
}

下面的示例演示如何使用 if ... else 语句。

var num1 = 7;
      var num2 = 10;
      if (num1 > num2) {
         alert("num1比num2大");
      }
      else{
         alert("num1比num2小");
      }

 执行结果:

2.3else if 语句(多分支结构)

如果第一个条件为 false,则可以使用 else if 语句指定新条件。

var course = 2;
if (course == 1) {
   document.write("<h1>HTML 教程</h1>");//如果 course 等于1,输出 "HTML教程"
} 
else if (course == 2) {
   document.write("<h1>CSS 教程</h1>");//或者 course 等于2,则输出 "CSS教程" 
} 
else {
   document.write("<h1>JavaScript 教程</h1>");//如果上述条件均不成立,则输出 "JavaScript教程"
}

执行结果:

 

 else 语句总是在 if 和 else if 后面 

当 if 与所有的 else if 条件均不成立时执行 else 语句代码块。

我们将 course 值设置为 3 时。

var course = 3;
if (course == 1) {
   document.write("<h1>HTML 教程</h1>");//如果 course 等于1,输出 "HTML教程"
} 
else if (course == 2) {
   document.write("<h1>CSS 教程</h1>");//或者 course 等于2,则输出 "CSS教程" 
} 
else {
   document.write("<h1>JavaScript 教程</h1>");//如果上述条件均不成立,则输出 "JavaScript教程"
}

执行结果: 

 

3、switch结构

3.1switch 语句

用来进行等值判断

switch 语句用于基于不同条件来执行不同的动作

 语法:

switch (表达式) {  // 表达式为要判断的内容
    case 常量1:
        代码块1
        break;
    case 常量 2:
        代码块2
        break;
    …


    default:  // 当所有常量都无法匹配时会执行default语句
        语句;
}

您可以使用多个 if ... else 语句来实现相同的结果,但是 switch 语句在这种情况下更有效

 3.2break 关键词

当javascript代码执行到 break 时, 将跳出 switch代码块 继续往下执行。

通常情况下一个 case 中放置一个 break

3.3default 关键词

如果 switch 中没有匹配的项,默认执行 default代码块

var today=Number(prompt("今天星期几(1-7):"));  
    switch(today){
        case 1:
            console.log("今天吃包子");
            break;//如果不写break,一旦匹配后就会一直往下执行,直到遇到break为止
        case 2:
            console.log("今天吃油条");
            break;
        case 3:
        case 4:
        case 5://相同操作的情况可以写成这样 
            console.log("今天吃煎饼");
            break;
        case 6:
        case 7:    
            console.log("今天不吃,今天睡到自然醒");
            break;
        default://如果前面的case都不匹配,才会执行default
            console.log("输入的参数错误!");
            break;    
    }

当输入8时执行结果:

如果不需要默认操作 default 可以省略 

4、两者的区别

  • switch结构

只能进行等值的判断,更直观

  • if结构

没有限制,适合某个连续区间的判断

​二、循环结构

1、 简介

重复性的执行某个操作,就是循环,称为循环结构

​ 循环结构的类型:while、do...while、for、for...in、for...of

2.、while循环

只要指定条件为 true,循环就可以一直执行代码块。

while 循环会在指定条件为真时循环执行代码块。

​ 语法:

while(条件){
    代码块
}

特点:先判断,再执行,只要条件成立就不停的执行

           条件可以是返回 true 或 false 的任何条件语句。

         如果您忘记增加条件中所用变量的值,该循环永远不会结束。这可能导致浏览器崩溃。

注意: 确保 while 循环中的条件最终变为 false, 不然循环永远不会结束

实例: 

//在页面上输出[1,200]之间所有能被7整除,但不能被4整除的所有整数,并统计个数,同时要求输出时每行显示5个
            var i=1;
            var count=0;//个数
            while(i<=200){
                if(i%7==0&&i%4!=0){
                    document.write(i+"&nbsp;&nbsp;&nbsp;");
                    //统计个数
                    count++;
                    //判断每输出5个,换一行
                    if(count%5==0){
                        document.write("<br>");
                    }
                }
                i++;
            }
            document.write("<br>共计:"+count+"个")

执行结果: 

 

3、do...while循环

do while 循环是 while 循环的变体。该循环会在检查条件是否为真之前,执行一次代码块,然后如果条件为真的话,就会重复这个循环。

​ 语法:

do{
    代码块
}while(条件);

​ 特点:先执行,再判断,循环操作至少会执行一次

 注意: 在do ... while循环结束时使用的分号。

别忘记增加条件中所用变量的值,否则循环永远不会结束!

实例:

            //循环提示用户输入5个整数,然后输出其中的最大值和最小值
            //先提示用户输入一次,然后将该数字作为最大值和最小值
            var num=Number(prompt("请输入一个整数:"));
            var max=num;
            var min=num;
            var i=1;
            do{
                var num=Number(prompt("请输入一个整数:"));
                if(num>max){
                    max=num;
                }
                if(num<min){
                    min=num;
                }
                i++;
            }while(i<=4);
            console.log("最大值:"+max);
            console.log("最小值:"+min);

4、 for循环

循环可以将代码块执行指定的次数。

如果您希望一遍又一遍地运行相同的代码,并且每次的值都不同,那么使用循环是很方便的。

​ 语法:

for(初始化;条件;迭代){
    代码块
}

语句 1(初始化):在循环(代码块)开始之前执行。

语句 2 (条件):定义运行循环的条件(代码块)。

语句 3 (迭代):在执行循环(代码块)之后每次执行。

注意:3个语句都可以省略,但分号不能省略

实例:

            //循环输入5门课的成绩,并计算平均分
            var sum=0;
            for(i=1;i<=5;i++){
                var score=Number(prompt("请输入第"+i+"门课的成绩:"));
                sum+=score;
            }
            var avg=sum/5;
            console.log("5门课的平均分为:"+avg);

如果语句2返回 true,循环将重新开始,如果返回 false,循环将结束。 语句2也是可选的。

如果您省略了语句 2,那么必须在循环内提供 break。否则循环就无法停下来。这样有可能令浏览器崩溃。

语句3 也是可选的,通常用来改变初始的变量值,它可以做任何操作包括自增(i++),自减(i--),正增量(i=i+5)等任何语句。

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

 执行结果:

5、for...in循环

​ 对集合数据进行迭代遍历

​ 语法:

for(循环变量 in 集合){
  循环操作
}

​ 循环变量是遍历到的数据在集合中的索引顺序(从0开始),而非数据本身

​ 可以通过集合[循环变量]的形式获取数据

           var str="welcome";//字符串,可以将字符串看作是由许多字符组成的集合
            for(var index in str){//index表示集合中每个元素的索引/序号,索引从0开始,并不是元素本身
                console.log(index,str[index]);
            }

 

实例:

//提示用户输入一段英文,统计并输出其中的元音字母(aeiou)的个数
            var english=prompt("请输入一段英文:");//helloeveryonewoaixuexi
            var count=0;
            for(var i in english){
                if(english[i]=="a"||english[i]=="e"||english[i]=="i"||english[i]=="o"||english[i]=="u"){
                    count++;
                }
            }
            console.log("共有"+count+"个元音字母");

执行结果:

 

6、 for...of循环

​ 对集合数据进行迭代遍历

​ 语法:

for(循环变量 of 集合){
  循环操作
}

​ 循环变量就是遍历到的数据本身

 var str="welcome";
            for(var c of str){//c表示集合中的每个元素
                console.log(c);
            }

执行结果:

 7、总结

​ 循环次数确定时一般使用for

​ 循环次数不确定时一般使用while和do...while

​ 对集合进行遍历时使用for...in和for...of

8、循环控制

​ break:跳出整个循环,执行循环之后的代码,一般与if一起使用

​ continue:跳出本次循环,执行下一次循环(本次尚未执行完的代码不再执行)

break:

//将1-20之间的整数相加,当累加值大于50时停止相加,输出当前整数和累加值
            var sum=0;
            for(var i=1;i<=20;i++){
                sum+=i;
                if(sum>50){
                    console.log("当前整数:"+i+",累加值:"+sum);
                    break;//停止循环的执行
                }
            }

执行结果:

continue:

//计算1-10之间所有偶数和
            var sum=0;
            for(var i=1;i<=10;i++){
                if(i%2!=0){
                    continue;//如果i是奇数,则跳过本次循环,不累加,执行下一次循环
                }
                sum+=i;
            }
            console.log(sum);

执行结果:

9、二重循环

​ 一个循环中嵌套着另一个循环,称为二重循环,各种循环可以相互嵌套

  • 外层循环变量变化一次,内层循环变量要变化一遍
  • 二重循环中的break和continue,遵循就近原则
//某次程序大赛,共有三个班参加,每个班级有四名学生,输入各班级每个学生的成绩,然后计算各班级的平均分
            //外层循环控制班级数量
            for(var i=1;i<=3;i++){
                alert("请输入第"+i+"个班级的学生信息")
                //内层循环控制班级的学生数量
                var sum=0;//每个班级的部分
                for(var j=1;j<=4;j++){
                    var score=Number(prompt("请输入第"+j+"个学生的成绩:"));
                    sum+=score;
                }
                console.log("第"+i+"个班级的平均分为:"+sum/4);

            }

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2095417.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

第十七篇——九变篇:紧扣战略重心,别跑题

目录 一、背景介绍二、思路&方案三、过程1.思维导图2.文章中经典的句子理解3.学习之后对于投资市场的理解4.通过这篇文章结合我知道的东西我能想到什么&#xff1f; 四、总结五、升华 一、背景介绍 九变种前面偏向宏观给讲解了九变的含义&#xff1b;这一篇通过更加微观的…

如何基于numpy和scipy实现曲面的最大梯度计算与显示

大家在做三维可视化研究过程中,经常需要做三维曲面的绘制和相交分析,在不知道三维曲面方程的情况下,如何基于曲面散点数据计算曲面的最大梯度点和梯度线的三维可视化是大家基于曲面分析研究中的重点关注的问题,本文在python环境下,基于numpy、pandas、scipy和matplotlib等…

MYSQL————联合查询

联合多个表进行查询 设计数据时把表进行拆分&#xff0c;为了消除表中字段的依赖关系&#xff0c;比如部分函数依赖&#xff0c;传递依赖&#xff0c;这时会导致一条SQL查出来的数据&#xff0c;对于业务来说是不完整的&#xff0c;我们就可以使用联合查询把关系中的数据全部查…

dk安装redis

docker search redis docker pull redis 由于我是使用的镜像 所以我的拉取命令就是 docker pull dockerpull.com/redis 拉下镜像之后&#xff0c;点击下面地址选择自己需要的 redis 版本的配置文件 redis/redis.conf at 6.2.6 redis/redis GitHubRedis is an in-memory data…

Python和Java及MATLAB和CUDA显微镜导图

&#x1f3af;要点 交互式设备控制和图像处理图像背景和阴影校正可视化萤光团位置算法和读取光学图像读写转换显微镜图像生物医学细胞图像分析荧光图像算法计算亮度数据和模拟表征新型染料和缓冲液强度估计细菌图像分析扫描透射和高分辨率透射图像模拟多模态成像分割可视化透射…

python安装protobuf记录

需求背景 客户需要protobuf环境配置以及插件安装&#xff0c;我主要通过在pycharm里面配置参数&#xff0c;将问题解决&#xff01; 导语 Python中的protobuf(Protocol Buffers)是一种用于序列化结构化数据的语言无关、平台无关、可扩展的机制。它能够让您在不同的应用程序和语…

搭建基于QT的TCP服务器与客户端

1、实现功能 1、服务器和客户端能够建立连接 2、服务器可以给客户端发送信息 3、客户端可以给服务器发送信息 2、server 2-1、widget.h #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QTcpServer> #include <QTcpSocket> QT_BEGIN_NA…

2024 年 IBM 量子开发者大会:等你来

在 2024 年 IBM Quantum™ 开发者大会上&#xff0c;与会者将获得 IBM Quantum 尖端工具和即将推出的路线图更新的独家、亲身预览&#xff0c;所有这些都围绕一个主题 — — Qiskit 的性能。 2024 年 IBM 量子开发者大会 在此申请 重要日期 7 月 24 日&#xff1a; 开放申请 8 …

leetcode 902. Numbers At Most N Given Digit Set

题目链接 Given an array of digits which is sorted in non-decreasing order. You can write numbers using each digits[i] as many times as we want. For example, if digits [1,3,5], we may write numbers such as 13, 551, and 1351315. Return the number of posit…

Docker续6:容器网络

1.bridge-utils 一个用于Linux系统的网络桥接工具集。它提供了一些命令行工具&#xff0c;帮助用户创建、管理和配置网络桥接。网络桥接是一种将多个网络接口连接在一起&#xff0c;以使它们能够作为单个网络段进行通信的技术。 bridge-utils 常用的命令包括&#xff1a; b…

大阪OSAKA分子泵电源TC163HTC203TC353TC523TC1104TC553TC1813手侧

大阪OSAKA分子泵电源TC163HTC203TC353TC523TC1104TC553TC1813手侧

六、泛型事件框架

一、创建一个BaseEventSO的 基类 写一个泛型事件《T》 启动事件?.Invoke 二、创建一个监听类 同样泛型匹配Event的监听事件 创建OnEable在其中注册事件&#xff1b;OnDisable中注销事件 写一个if语句进行判断是否为空 三、创建一个ObjectEvent 传递Object 原因&#xf…

axios发送post请求实例

在body中的数据格式又有两种&#xff0c;一种是 json 数据格式&#xff0c;另一种是 字符串。具体要用哪种格式取决于后端入参的格式。 如果后端接收json数据类型&#xff0c;post 的 headers 需要设置 { ‘content-type’: ’application/json’ }&#xff0c;传给后端的数…

初学流量分析

一、基本知识 比赛中提供一个包含流量数据的 PCAP 文件&#xff0c;有时候也会需要选手们先进行修复或重构传输文件后&#xff0c;再进行分析。 PCAP 这一块作为重点&#xff0c;复杂的地方在于数据包里充满着大量无关的流量信息&#xff0c;因此如何分类和过滤数据是参赛者需…

stm32f103c8t6引脚功能

STM32F103C8T6拥有丰富的引脚功能&#xff0c;主要包括广泛的GPIO引脚、多种通信接口和特定的调试及电源管理引脚。 STM32F103C8T6是一款基于ARM Cortex-M3内核的微控制器&#xff0c;广泛应用于各种嵌入式系统设计中。它具有72MHz的处理速度&#xff0c;搭载128KB的Flash内存…

行业寒冬下的职场生态:卷与痛的交响曲

在2024年的初春&#xff0c;当万物复苏的季节理应带来希望与机遇之时&#xff0c;职场却笼罩在一片前所未有的“寒冬”之中。经济的波动、技术的快速迭代以及市场需求的微妙变化&#xff0c;共同编织了一幅复杂而严峻的行业图景。工作岗位的数量锐减&#xff0c;质量下滑&#…

域名解析DNS服务

DNS服务基础知识 DNS&#xff1a;Domain Name System (域名系统) DNS 是互联网上解决网络中机器命名的一种系统。在网络中&#xff0c;一台主机去访问另外一台主机时&#xff0c;必须要 知道目标主机的IP地址&#xff0c;虽然网络上的节点都可以用IP地址来标识&#xff0c;并且…

Unity | 基础知识

装箱和拆箱&#xff1a; 获取对方的类型&#xff1a; GetType通过打点调用 as进行类型转换 运用Convert进行类型转换&#xff1a; 二维数组的定义 结构体类型 不同名称空间来调用&#xff1a;

构建开发全能型档期预约系统

档期预约系统作为一种高效的时间管理和资源分配工具&#xff0c;在现代社会中的应用越来越广泛。以下是关于档期预约系统的详细分析&#xff1a; 一、系统概述 档期预约系统旨在帮助各类服务机构&#xff08;如医疗机构、美容院、教育培训机构等&#xff09;优化服务流程&…

低代码开发平台:重塑未来软件开发格局的关键力量

低代码开发平台正以前所未有的速度改变着软件开发的面貌&#xff0c;通过最小化手动编码&#xff0c;让用户能够迅速构建应用程序。随着企业对敏捷性和创新能力的追求日益增强&#xff0c;这类平台的需求激增。展望未来&#xff0c;技术进步与市场动态将引领低代码开发进入新的…