首页 > 其他分享 >JS流程控制

JS流程控制

时间:2024-09-07 15:22:53浏览次数:12  
标签:语句 控制 console 流程 JS break while 循环 表达式

流程控制

在任何一门程序设计语言中,都需要支持满足程序结构 化所需要的三种流程控制:

  • 顺序控制

  • 分支控制(条件控制)

  • 循环控制

顺序控制:在程序流程控制中,最基本的就是顺序控制。程序会按照自上而下的顺序执行。

if语句【重要】

分类:单分支,双分支,多分支,分支嵌套

()只能是变量或值,不能是表达式

示例:

// 单分支
if (条件表达式){
   代码段
}
// 双分支
if (条件表达式) {
    代码段1 
}else {
   代码段2
}
// 多分支
if (条件表达式1){
    代码段1
} else if (条件表达式2){
   代码段2
} else if (条件表达式3){
   代码段3
}else{
    代码段4
}

Switch语句

()只能是变量或值,不能是表达式

var d = new Date();
console.log(d); // 获取日期时间对象
var week = d.getDay(); // 获取星期几
switch (week) {
  case 0:
    console.log('星期天');
    break;
  case 1:
    console.log('星期一');
    break;
  case 2:
    console.log('星期二');
    break;
  case 3:
    console.log('星期三');
    break;
  case 4:
    console.log('星期四');
    break;
  case 5:
    console.log('星期五');
    break;
  case 6:
    console.log('星期六');
    break;
}

if语句和switch的不同

if:条件是一个范围 或者 是具体的值

switch:条件是一个具体的值

循环控制语句

 while语句【掌握】

While 循环会在指定条件为真时循环执行代码块。 While循环,先进行条件判断,再执行循环体的代码

while (条件表达式){
  循环体
}

注意:当前循环中,如果不满足条件,一次都不会执行

var i=1;
    do{
        i++; // 2
        console.log(i);
    }while(i<=10)
do......while

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

do {
    代码段
} while (条件表达式)

注意:当前循环中,代码至少执行一次

var i=1;
    do{
        i++; // 2
        console.log(i);
    }while(i<=10)

for循环【重要】

for (循环变量初始化表达式; 循环条件表达式; 更新循环变量表达式) {
    循环体
}

注意:

  1. 循环变量可以定义在for 循环结构体外

  2. 没有更新循环变量会变成死循环

  3. 循环条件中的‘;’不能省略

案例:循环输出5个div标签

for(var i=0;i<5;i++){
  document.write('<div>1</div>')
}

案例:循环输出table表格,创建四行5列的表格

document.write('<table border="1">')
      for(var j=1;j<=4;j++){
        document.write('<tr>')
          for(var i=0;i<=3;i++){
            document.write('<td>@</td>');
          }
        document.write('</tr>')
      }
document.write('</table>')

案例:实现阶梯效果图

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            background-color: green;
            width: 50px;
            height: 50px;
            margin: 0.05rem; 
            display: inline-block;
        }
    </style>
</head>
<body>
</body>
<script>
    for( row = 0 ; row < 6 ;row++){
        for( col = 0; col <6-row ; col=col+1 ){
        document.write('<div>*</div>')
    }
    document.write('<br>')
}
</script>
</html>

for...in

for (变量 in 对象) {
   代码段
}
  • for...in 语句用来遍历对象的每一个属性。每次都将属性名作为字符串保存在变量里

  • 在无法预知对象的任何信息,和循环次数的时候使用

  1. 跳转语句

 continue

continue语句只能应用在循环中(while、do......while、for)语句中 用于中止本次循环,根据控制表达式还允许继续进行下一次循环。

var iNum = 0; 
for (var i=1; i<10; i++) {
  if (i % 5 == 0) {
    document.write(i);

    continue;
  }
  iNum++;
}
alert(iNum);
break

break语句只能应用在循环(while、do......while、for)或switch语句中 break语句用于退出循环,阻止再次反复执行任何代码或者退出一个switch语句


for (var i=1; i<10; i++) {
  if (i % 5 == 0) {
    break;
  }
  iNum++;
}
alert(iNum);

标签:语句,控制,console,流程,JS,break,while,循环,表达式
From: https://blog.csdn.net/zzjwyck/article/details/141996505

相关文章

  • json字符串转义格式化后再转换处理demo StringEscapeUtils.unescapeJava
    json字符串转义格式化后再转换处理demoStringEscapeUtils.unescapeJava报错关键字:illegalidentifierExpectedBEGIN_OBJECTbutExpectednameatpackagecom.example.core.mydemo;importcom.alibaba.fastjson.JSON;importcom.fasterxml.jackson.core.JsonProcessingE......
  • 微服务实战——品牌管理(JSR303,SKU&SPU)
    品牌管理1.JSR3031、给Bean添加校验注解:javax.validation.constraints,并定义自己的message提示2、开启校验功能@Valid  效果:校验错误以后会有默认的响应;3、给校验的参数bean后紧跟一个BindingResult,就可以获取到校验的结果4、分组校验(多场景的复杂校验)    1......
  • Node.js版本管理工具之NVM
    目录一、NVM介绍二、NVM的下载安装1、NVM下载2、卸载旧版Node.js3、安装三、NVM配置及使用1、设置nvm镜像源2、安装Node.js3、卸载Node.js4、使用或切换Node.js版本5、设置全局安装路径和缓存路径四、常用命令 一、NVM介绍在工作中,不同的项目可能需要不同NodeJS版本,所以维护多......
  • 280java jsp SSM Springboot旅游推荐系统旅游景点路线管理(源码+文档+开题+PPT+运行视
    项目技术:Springboot+Maven+Vue等等组成,B/S模式+Maven管理等等。环境需要1.运行环境:最好是javajdk1.8,我们在这个平台上运行的。其他版本理论上也可以。2.IDE环境:IDEA,Eclipse,Myeclipse都可以。推荐IDEA;3.tomcat环境:Tomcat7.x,8.x,9.x版本均可4.硬件环境:windows......
  • Shell脚本流程控制(Linux篇)
    1.流程控制流程控制是改变程序运行顺序的指令。1.1.条件判断1.1.1.文件类型判断参数说明-d判断指定的目录是否存在-e判断文件是否存在,存在即为真-f判断普通文件是否存在-L判断文件是否存在且为连接文件示例一:#判断文件是否存在,存在为0,不存在为1root@zking:~#test-ea......
  • 【教程】在 Termux 中部署 MYScrcpy, 实现手机局域网WEB投屏控制
    在Termux中部署MYScrcpy实现局域网Web访问有关MYScrcpy,访问GithubGitee1.安装termux2.安装python环境#换源termux-change-repopkgupgrade#installpythonpkginstallpython#确认是否安装成功python-V3.安装MYScrcpy所需环境#基础环......
  • 【保姆级教程】使用 PyTorch 自定义卷积神经网络(CNN) 实现图像分类、训练验证、预测全
    《博主简介》小伙伴们好,我是阿旭。专注于人工智能、AIGC、python、计算机视觉相关分享研究。......
  • 配置免安装版的apache-tomcat环境,jdk11版本以上。解决控制台环境配置显示成功,确打不开
    我这里下的是jdk22版,https://download.oracle.com/java/22/latest/jdk-22_windows-x64_bin.ziphttps://download.oracle.com/java/22/latest/jdk-22_windows-x64_bin.zip 解压后放在没有中文路径的地方。win+s搜env回车打开环境变量,新建一个变量名:JAVA_HOME,值:为你的jdk解压......
  • thinkjs + puppeteer=解决中文乱码+https错误
    asyncindexAction(){constself=this;constbrowser=awaitpuppeteer.launch({headless:true,ignoreHTTPSErrors:true,args:['--no-sandbox','--disable-setuid-sandbox']});constpage=awaitbrowser.newPage();/......
  • 行政组织理论-第十二章:政府再造流程
    章节章节汇总第一章:绪论第二章:行政组织的演变第三章:科层制行政组织理论第四章:人本主义组织理论第五章:网络型组织理论第六章:行政组织目标第七章:行政组织结构第八章:行政组织体制第九章:行政组织设置与自身管理第十章:组织激励第十一章:创建学习型组织第十二章:政府再造流程第十三......