JS - 分支结构、循环结构

关于JavaScript中的分支结构和循环结构,其实和其他编程语言区别也不是很大,只是js对这两种结构进行了相应的扩充,当然本质上并没有变化,本篇就是一篇记录博主在学习前端路上的总结和敲过的demo,实际上水份很大,但是保留博主在学习路上的笔记,对于大部分开发者而言,这些都是常识,大家都知道,但是对于博主而言,这些是博主成长路上的见证,是博主本人宝贵的财富。

JS中的分支结构

if

用于根据条件执行不同的代码块。

if (condition) {// 如果条件为真,执行这里的代码
}

if-else

if (condition) {// 如果条件为真,执行这里的代码
} else {// 如果条件为假,执行这里的代码
}

if - else if - else

用于根据多个条件执行不同的代码块。

if (condition1) {// 如果条件1为真,执行这里的代码
} else if (condition2) {// 如果条件2为真,执行这里的代码
} else {// 如果以上条件都为假,执行这里的代码
}
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script type="text/javascript">/**prompt()可以弹出一个提示框,该提示框中会带有一个文本框*用户可以在文本框中输入一段内容,该函数需要一个字符串作为参数* 该字符串将会作为提示框的提示文字* 用户输入的内容将会作为函数的返回值返回,可以定义一个变量来接受该内容*///练习一/*var score = prompt("小明的期末考试成绩:");if(score == 100){document.write("奖励一辆BMW");}else if(score >=80 && score <=99){document.write("奖励一台iphone15s");}else if(score >=60 && score <80){document.write("奖励一本参考书");}else{document.write("无任何奖励");}*///练习二/*var height = prompt("男方身高为(单位cm):");var rich = prompt("男方家境情况(单位万):");var appearance = prompt("男方帅气值:");if(height >=180 && rich>=1000 && appearance >= 500){document.write("我一定要嫁给他");}else if(height >=180 || rich >= 1000 || appearance >= 500){document.write("嫁吧,比上不足,比下有余。");}else{document.write("不嫁");}*///练习三,prompt输入的变量类型是字符串,前面加个+让其变成Number类型var num1 = +prompt("请输入第一个整数:");var num2 = +prompt("请输入第二个整数:");var num3 = +prompt("请输入第三个整数:");var num4;console.log(typeof num1);/*if(num1 >= num2){num4 = num1;num1 = num2;num2 = num4;}if(num1 >= num3){num4 = num1;num1 = num3;num3 = num4;}if(num2 >= num3){num4 = num2;num2 = num3;num3 = num4;}document.write(num1 +"<" + num2 +"<" + num3);*/</script></head><body></body>
</html>

switch

用于根据不同的表达式值执行不同的代码块。

switch (expression) {case value1:// 如果表达式的值等于value1,执行这里的代码break;case value2:// 如果表达式的值等于value2,执行这里的代码break;default:// 如果表达式的值不匹配任何case,执行这里的代码
}
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script type="text/javascript">/**对于成绩大于60分的,输出合格*低于60分的,输出不合格*/var score = +prompt("输入你的成绩:");switch(true){case score >=60:document.write("合格");break;default:document.write("不合格");break;}/*var num2= +prompt("输入一个数字(1~7):");switch(num2){case 1:document.write("星期一");break;case 2:document.write("星期二");break;case 3:document.write("星期三级");break;case 4:document.write("星期四");break;case 5:document.write("星期五");break;case 6:document.write("星期六");break;case 7:document.write("星期日");break;}*/</script>
</head>
<body></body>
</html>

三元运算符

let result = condition ? value1 : value2;

循环结构

循环结构用于重复执行一段代码,直到满足特定条件为止。循环结构可以解决需要重复执行相同或类似任务的问题。JavaScript中存在一些特殊的循环结构,当然本质上和其他语言的循环结构大致都是相同的,万变不离其宗,大体还是相同的。接下来跟着我一起来了解一下JavaScript的循环结构吧。

for循环

这个大众都知道,只要你从事编程,这个都不知道,那么你该恶补一下基础知识了,for循环是我们用的最多的一种循环结构。他用于指定初始条件,循环条件,和每次迭代后的操作

for (初始化; 循环条件; 迭代操作) {// 循环体中的代码
}
//for循环从0开始,每次迭代增加1,直到i小于5为止。循环体中的代码会被执行5次,分别输出0到4。
for (let i = 0; i < 5; i++) {console.log(i);
}

for循环适用于已知循环次数的情况,可以通过控制循环条件和迭代操作来控制循环的执行次数。

while循环

在循环开始之前检查循环条件,只要条件为true,那就会重复执行循环体中的代码。注意:使用不当容易造成死循环,建议结合break使用

while (循环条件) {// 循环体中的代码
}
//while循环会在每次迭代之前检查条件i是否小于5。只要条件为真,循环体中的代码会被执行。循环体中的代码会被执行5次,分别输出0到4。
let i = 0;
while (i < 5) {console.log(i);i++;
}

while循环适用于未知循环次数的情况,只要条件为真,就会一直执行循环体中的代码。

do - while循环

do-while循环:先执行循环体中的代码,然后再检查条件。只要条件为真,就会重复执行循环体中的代码。

do {// 循环体中的代码
} while (循环条件);
//do-while循环会先执行循环体中的代码,然后再检查条件i是否小于5。只要条件为真,循环体中的代码会被执行。循环体中的代码会被执行5次,分别输出0到4。
let i = 0;
do {console.log(i);i++;
} while (i < 5);

do-while循环与while循环类似,但它保证循环体至少执行一次,即使条件一开始就为假。

for … in 循环

用于遍历对象中的可枚举属性

for (变量 in 对象) {// 循环体中的代码
}
//for...in循环会遍历person对象的每个可枚举属性,并将属性名赋值给变量key。循环体中的代码会被执行3次,分别输出"name: John"、"age: 30"和"city: New York"。
const person = {name: "John",age: 30,city: "New York"
};
for (let key in person) {console.log(key + ": " + person[key]);
}

for…in循环会遍历对象的每个可枚举属性,并将属性赋值给变量,然后执行循环体中的代码。

for … of 循环

用于遍历可迭代对象(如数组、字符串等)的元素。

for (变量 of 可迭代对象) {// 循环体中的代码
}
//for...of循环会遍历colors数组的每个元素,并将元素值赋值给变量color。循环体中的代码会被执行3次,分别输出"red"、"green"和"blue"。
const colors = ["red", "green", "blue"];
for (let color of colors) {console.log(color);
}

for…of循环会遍历可迭代对象的每个元素,并将元素赋值给变量,然后执行循环体中的代码。

break和continue

break:用于立即终止循环,并跳出循环体。当执行到 break 关键字时,循环会立即停止,不再执行循环体中剩余的代码,然后程序会继续执行循环之后的代码。

continue:用于跳过当前迭代,继续执行下一次迭代。当执行到 continue 关键字时,循环会跳过当前迭代剩余的代码,直接进入下一次迭代。

//当 i 的值等于 3 时,break 语句会被执行,循环会立即终止,输出结果为 0、1、2。
for (let i = 0; i < 5; i++) {if (i === 3) {break;}console.log(i);
}
//当 i 的值等于 2 时,continue 语句会被执行,当前迭代的剩余代码会被跳过,直接进入下一次迭代,输出结果为 0、1、3、4。
for (let i = 0; i < 5; i++) {if (i === 2) {continue;}console.log(i);
}

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

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

相关文章

Jmeter 性能-死锁问题定位+分析

1、环境搭建 ①准备脚本&#xff0c;执行压测 ②用Jstack 打印日志 jstack 112759 >dead.log ③下载日志到本地 sz dead.log 2、问题定位 ①打开dead.log&#xff0c;搜索deadlock ②查看死锁的线程 ③查看死锁位置 3、问题分析 ①下载死锁的类文件 Sz CaseControlle…

使用iMazing对iPhone有影响吗 为什么iPhone都会装iMazing来管理 苹果手机imazing安装

随着科技的迅速发展&#xff0c;智能手机已成为我们日常生活中不可或缺的一部分&#xff0c;iPhone手机占据了智能手机市场的大部分&#xff0c;也有着庞大的用户基础。随着时代的发展&#xff0c;用户对于更高级的设备管理工具的需求也随之增加。iMazing作为一款强大的设备管理…

美业连锁门店收银系统源码-如何查看收款门店对应的加盟商?

美业管理系统源码 博弈美业SaaS系统 连锁多门店美业收银系统源码 多门店管理 / 会员管理 / 预约管理 / 排班管理 / 商品管理 / 促销活动 PC管理后台、手机APP、iPad APP、微信小程序 第一步&#xff1a; 登录pc管理后端 第二步&#xff1a; 进入企业组织管理-门店管理&a…

pandas/python 一个实战小案例

上次写坦克游戏的时候&#xff0c;接触了一点pandas&#xff0c;当时只是简单了解了一下如何遍历行和列并获取值来替换图片&#xff0c;想更多了解pandas。正好有一些数据需要筛选&#xff0c;试试能不能用通过代码实现。虽然总的来说不复杂&#xff0c;但由于原始数据在命名、…

ai写作强大,ai写作哪个软件最好用?

在当今数字化时代&#xff0c;ai技术的发展正以惊人的速度改变着我们的生活和工作方式。其中&#xff0c;ai写作作为一项令人瞩目的创新&#xff0c;展示了强大的文本生成能力。然而&#xff0c;随着各种ai写作软件的涌现&#xff0c;人们不禁困惑&#xff1a;哪个软件才是最好…

js删除对象中值为null的属性

需求&#xff1a;在做编辑操作的时候&#xff0c;后端不需要值为null的数据&#xff0c;所以默认把编辑中值为null的数据传给他会编辑失败&#xff0c;所以前端做个筛选就行了 let obj {id: 1,name: "翠花",sex: 18,hobby: null,age: null,};// 使用Object.entries(…

SQLite数据库中JSON 函数和运算符(二十七)

返回&#xff1a;SQLite—系列文章目录 上一篇:维护SQLite的私有分支&#xff08;二十六&#xff09; 下一篇&#xff1a;SQLite—系列文章目录 ​1. 概述 默认情况下&#xff0c;SQLite 支持 29 个函数和 2 个运算符 处理 JSON 值。还有两个表值函数可用于分解 JSON 字…

大模型应用开发基础

AGI 时代&#xff0c;AI 无处不在&#xff0c;形成新的社会分层&#xff1a; AI 使用者&#xff0c;使用别人开发的 AI 产品AI 产品开发者&#xff0c;设计和开发 AI 产品基础模型相关&#xff0c;训练基础大模型&#xff0c;或为大模型提供基础设施 越向下层&#xff0c;重要…

MEMENTO(备忘录)-- 对象行为型模式

意图&#xff1a; 在不破坏封装性的前提下&#xff0c;捕获一个对象的内部状态&#xff0c;并在该对象之外保存这个状态。这样以后就可将该对象恢复到原先保存的状态。 别名&#xff1a; Token 动机&#xff1a; 有时必要记录一个对象的内部状态。 适用性&#xff1a; a. 必…

【云计算】云数据中心网络(五):对等连接

《云网络》系列&#xff0c;共包含以下文章&#xff1a; 云网络是未来的网络基础设施云网络产品体系概述云数据中心网络&#xff08;一&#xff09;&#xff1a;VPC云数据中心网络&#xff08;二&#xff09;&#xff1a;弹性公网 IP云数据中心网络&#xff08;三&#xff09;…

跟TED演讲学英文:How AI could save (not destroy) education by Sal Khan

How AI could save (not destroy) education Link: How AI could save (not destroy) education Speaker: Sal Khan Date: April 2023 文章目录 How AI could save (not destroy) educationIntroductionVocabularyTranscriptSummary后记 Introduction Sal Khan, the founder…

遥瞻智慧:排水系统远程监控的卓越解决方案

遥瞻智慧&#xff1a;排水系统远程监控的卓越解决方案 在城市脉络的深层肌理中&#xff0c;排水系统犹如一条条隐秘的生命线&#xff0c;默默承载着城市的呼吸与律动。然而&#xff0c;如何以科技之眼&#xff0c;赋予这些无形网络以实时感知、精准调控的能力&#xff0c;使之…

网络管理实验三、SNMP协议工作原理验证与分析

1 实验概括 实验目的&#xff1a; 学习捕获SNMP报文&#xff0c;通过报文分析理解SNMP协议的工作过程。 实验内容&#xff1a; 1&#xff09; 使用snmputilg发送SNMP数据包; 使用wireshark抓包&#xff1b;使用netstat –an查看代理站TCP/UDP连接表&#xff1b; 2&#xff09;…

识周期以备,用周期以对

坐在阳台上喝茶&#xff0c;看着三角梅的花朵绽放着&#xff0c;凋零着&#xff0c;随风飘落… 春夏秋冬&#xff0c;花开花落。不禁感慨生命之渺小&#xff0c;敬畏周期的力量。 今天抽空聊聊周期&#xff0c;周期的核心是均值回归&#xff0c;周期也是“道”。 1 过去40年&am…

深入解析Tomcat的工作流程

tomcat解析 Tomcat是一个广泛使用的开源Servlet容器&#xff0c;用于托管Java Web应用程序。理解Tomcat的工作流程对于开发人员和系统管理员来说是非常重要的。本文将深入探讨Tomcat的工作原理&#xff0c;包括请求处理、线程池管理、类加载、以及与Web服务器之间的通信。 ###…

【错题集-编程题】腐烂的苹果(多源 BFS + 最短路)

题目链接&#xff1a;腐烂的苹果_牛客题霸_牛客网 (nowcoder.com) 一、分析题目 多源 BFS 问题&#xff0c;加一点最短路的思想&#xff0c;固定套路。 二、代码 //看了题解之后AC的代码 class Solution { private:int n, m;bool vis[1010][1010];int dx[4]{-1,0,1,0}, dy[4]{…

Java 集合(ArrayList、LinkedList、HashMap、HashSet、LinkedHashMap、LinkedHashSet)【补充复习】

Java 集合&#xff08;ArrayList、LinkedList、HashMap、HashSet、LinkedHashMap、LinkedHashSet&#xff09;【补充复习】 Java 集合概述Collection 接口继承树Map 接口继承树 Collection 接口方法使用 iterator 接口遍历集合元素使用 forearch 遍历集合元素 List 接口List 实…

Java中的栈和队列

1.前言 在计算机科学中&#xff0c;数据结构是用来组织和存储数据的方式&#xff0c;以便可以高效地访问和修改。栈和队列是两种最基本的数据结构&#xff0c;它们在各种计算过程中都有广泛的应用。本文将介绍栈和队列的概念、特性以及它们的一些常见应用。 2.栈 2.1概念 栈…

求不同字符个数(C语言)

一、N-S流程图&#xff1b; 二、运行结果&#xff1b; 三、源代码&#xff1b; # define _CRT_SECURE_NO_WARNINGS # include <stdio.h>int main() {//初始化变量值&#xff1b;char c 0;int a 0, k 0, n 0, q 0;//提示用户&#xff1b;printf("请输入一段话:…

【Java探索之旅】用面向对象的思维构建程序世界

&#x1f3a5; 屿小夏 &#xff1a; 个人主页 &#x1f525;个人专栏 &#xff1a; Java编程秘籍 &#x1f304; 莫道桑榆晚&#xff0c;为霞尚满天&#xff01; 文章目录 &#x1f4d1;前言一、初识面向对象1.1 什么是面向对象&#xff1f;1.2 面向对象与面向过程 二、类的定义…