春花秋月何时了,往事知多少。此付费专栏不要订阅,不要订阅,听人劝。
🌹作者主页:青花锁 🌹简介:Java领域优质创作者🏆、Java微服务架构公号作者😄
🌹简历模板、学习资料、面试题库、技术互助🌹文末获取联系方式 📝
系列专栏目录
[Java项目实战] 介绍Java组件安装、使用;手写框架等
[Aws服务器实战] Aws Linux服务器上操作nginx、git、JDK、Vue等
[Java微服务实战] Java 微服务实战,Spring Cloud Netflix套件、Spring Cloud Alibaba套件、Seata、gateway、shadingjdbc等实战操作
[Java基础篇] Java基础闲聊,已出HashMap、String、StringBuffer等源码分析,JVM分析,持续更新中
[Springboot篇] 从创建Springboot项目,到加载数据库、静态资源、输出RestFul接口、跨越问题解决到统一返回、全局异常处理、Swagger文档
[Spring MVC篇] 从创建Spring MVC项目,到加载数据库、静态资源、输出RestFul接口、跨越问题解决到统一返回
[华为云服务器实战] 华为云Linux服务器上操作nginx、git、JDK、Vue等,以及使用宝塔运维操作添加Html网页、部署Springboot项目/Vue项目等
[Java爬虫] 通过Java+Selenium+GoogleWebDriver 模拟真人网页操作爬取花瓣网图片、bing搜索图片等
[Vue实战] 讲解Vue3的安装、环境配置,基本语法、循环语句、生命周期、路由设置、组件、axios交互、Element-ui的使用等
[Spring] 讲解Spring(Bean)概念、IOC、AOP、集成jdbcTemplate/redis/事务等
前言
本章介绍JavaScript的控制、循环语句,包括:if、switch、while 、do while、for、for in、for of、跳出循环等。
1、if 语句
if (条件表达式 1) {
// 条件表达式 1 为真时执行的代码
} else if (条件表达式 2) {
// 条件表达式 2 为真时执行的代码
}
...
else if (条件表达式N) {
// 条件表达式 N 为真时执行的代码
} else {
// 所有条件表达式都为假时要执行的代码
}
<script>
function checkAge() {
var ageElement = document.getElementById("age")
var ageValue = ageElement.value;
if(ageValue < 0 ) {
alert("输入不合法")
} else if( ageValue <= 10 ) {
alert("儿童")
} else if( ageValue > 10 && ageValue < 18 ) {
alert("少年")
} else if( ageValue >= 18 && ageValue <= 40 ) {
alert("青年")
} else {
alert("老年")
}
}
</script>
<body>
<input type="number" id="age" placeholder="请输入年龄!">
<br>
<input type="button" onclick="checkAge()" value="确定">
</body>
2、switch语句
switch (表达式){
case value1:
statements1 // 当表达式的结果等于 value1 时,则执行该代码
break;
case value2:
statements2 // 当表达式的结果等于 value2 时,则执行该代码
break;
......
case valueN:
statementsN // 当表达式的结果等于 valueN 时,则执行该代码
break;
default :
statements // 如果没有与表达式相同的值,则执行该代码
}
<script>
function checkAge() {
var ageElement = document.getElementById("age")
var ageValue = ageElement.value;
var ageStatus = 0;
if(ageValue < 0 ) {
ageStatus = -1;
} else if( ageValue <= 10 ) {
ageStatus = 1;
} else if( ageValue > 10 && ageValue < 18 ) {
ageStatus = 2;
} else if( ageValue >= 18 && ageValue <= 40 ) {
ageStatus = 3;
} else {
ageStatus = 4;
}
switch (ageStatus) {
case -1:
alert("输入不合法") // 当表达式的结果等于 value1 时,则执行该代码
break;
case 1:
alert("儿童") // 当表达式的结果等于 value2 时,则执行该代码
break;
case 2:
alert("少年") // 当表达式的结果等于 value2 时,则执行该代码
break;
case 3:
alert("青年") // 当表达式的结果等于 valueN 时,则执行该代码
break;
default :
alert("老年") // 如果没有与表达式相同的值,则执行该代码
}
}
</script>
<body>
<input type="number" id="age" placeholder="请输入年龄!">
<br>
<input type="button" onclick="checkAge()" value="确定">
</body>
3、while循环语句
while (条件表达式) {
// 要执行的代码
}
var i = 1;
while( i <= 5) {
document.write(i+", ");
i++;
}
4、do while语句
do {
// 需要执行的代码
} while (条件表达式);
var i = 1;
do{
document.write(i + " ");
i++;
}while (i < 5);
5、for
for(initialization; condition; increment) {
// 要执行的代码
}
for (var i = 1; i <= 10; i++) {
document.write(i + " ");
}
6、for in
for (variable in object) {
// 要执行的代码
}
// 定义一个对象
var person = {"name": "Clark", "surname": "Kent", "age": "36"};
// 遍历对象中的所有属性
for(var prop in person) {
document.write("<p>" + prop + " = " + person[prop] + "</p>");
}
7、for of
for (variable of iterable) {
// 要执行的代码
}
// 定义一个数组
var arr = ['a', 'b', 'c', 'd', 'e', 'f'];
// 使用 for of 循环遍历数组中的每个元素
for (var value of arr) {
document.write(value + ", ");
}
document.write("<br>");
8、跳出循环
break
continue
JavaScript 中的标签就是一个标识符(类似变量名),后面跟随一个冒号:
将 break 与标签配合使用,则可以一次跳出多层循环。