JavaScript基础之四——选择与循环结构

简介: JavaScript基础之四——选择与循环结构

选择结构与循环结构是编程中处理逻辑的核心结构,JavaScript中支持if-else和switch-case选择结构,支持for,for-in,do-while,while循环结构。并且可以使用break与continue语句进行循环的跳出,简单的条件选择if语句示例如下:

//if条件语句
if (true) {

console.log("条件语句");

};
if (false) {

} else {

console.log("if-else语句");

};
var a = 10;
if (a < 10) {

console.log("a<10");

} else if (a == 10) {

console.log("a=10");

} else {

console.log("a>10");

};
switch-case选择结构用于多分支条件的选择,示例如下:

//选择语句
var b = "hi";
switch (b) {

case "hello":
    {
        console.log("Hello world");
    }
    break;
case "hi":
    {
        console.log("Hi world");
    }
    break;
default:
    {
        console.log("都没匹配上");
    }

}
需要注意,每个case结构后面原则上都需要使用break进行中断匹配,如果不添加此break,则匹配到一个case语句后switch结构并不会结束,会继续尝试匹配后面的case条件。

for循环结构用于处理大量重复的逻辑,示例如下:

for (var i = 0; i < 10; i++) {

console.log("循环" + i);

}
for (var i = 0; i < 10; i++) {

console.log("循环" + i);
if (i == 2) {
    //使用break可以提前中断循环
    break;
};

}
JavaScript还有一种更高效的循环模式,for-in结构,这种结构专门用来遍历对象,其可以将对象的属性遍历出来,示例如下:

var obj1 = {

name: "jaki",
age: 25

};
var obj2 = [1, 2, 3, 4, 5, 6, 7, 8];
for (var x in obj1) {

//跳过本次循环 并不是跳出循环
if (x == "name") continue;
console.log(x + ":" + obj1[x]);

}
for (var x in obj2) {

console.log(x + ":" + obj2[x]);

}
需要注意,对于数组,其遍历出来的是数组的下标,并不是其中的值,这和C/OC,Swift等语言有所差异,也证明了数组在JavaScript中其实就是一种特殊的对象。

while循环和do-while循环的差异在于whlie结构是先进行循环条件的判断,再进入循环体,而do-while结构则是先进入循环体,在进行循环条件的判断,示例如下:

var c = 1;
while (c < 10) {

console.log(c);
c++;

}
do {

console.log(c);
c--;

} while (c > 1);

前面提到过break和continue语句,break语句用于中断switch-case匹配或者跳出最近的循环,跳出循环的意思是指执行到break后,无论后面循环次数还有多少次,直接跳出,执行循环结构之后的代码。continue语句的作用则是跳出最近的本次循环,接着进行循环条件的判断,如果满足会继续进行循环,并且如果有多层循环嵌套,break和continue也可以通过label标签指定具体跳出那层循环,示例如下:

LAB: for (var i = 0; i < 5; i++) {

for (var j = 0; j < 5; j++) {
    if (j == 2) {
        break LAB
    };
    console.log(i + '==' + j);
};

};
上面的代码,如果不使用LAB标签,则外层循环不会被中断。

目录
相关文章
|
7月前
|
前端开发 JavaScript
JavaScript中的各种循环结构,包括其原理和使用场景
JavaScript中的各种循环结构,包括其原理和使用场景
103 3
|
7月前
|
JavaScript 前端开发 开发者
JavaScript基础-循环结构:for, while, do-while
【6月更文挑战第11天】本文介绍了JavaScript中的三种主要循环结构:`for`、`while`和`do-while`,并探讨了它们的使用、常见问题及易错点。文章强调了无限循环、逻辑错误和不当使用`do-while`的避免方法。通过代码示例展示了遍历数组、猜数字游戏和用户输入验证的应用场景,提醒开发者重视循环的正确使用和逻辑规划,以提升代码质量。
78 2
|
JavaScript
JS基础之解构赋值
解构赋值 在js中,我们经常会将对象或者数组里面的一部分数据作为参数传递给函数,如果我们使用传统的.方法会很麻烦。
|
移动开发 JavaScript 前端开发
JavaScript基础知识梳理-上
对JavaScript基础知识梳理-上
241 31
JavaScript基础知识梳理-上
|
存储 JavaScript 前端开发
JavaScript基础(一篇入门)
JavaScript基础(一篇入门)
228 0
JavaScript基础(一篇入门)
|
JavaScript 前端开发
2021琴理工作室JS基础教学(三)
当网页被加载的时候,浏览器就会创建文档对象模型,也就是dom 而dom可以看做一颗树
93 3
2021琴理工作室JS基础教学(三)
|
JavaScript 前端开发
JavaScript 入门基础 - 运算符(三)
文章目录 JavaScript 入门基础 - 运算符(三) 1.什么是运算符 2.表达式和返回值 3.算术运算符概述 4. 赋值运算符 5.递增和递减运算符 5.1 递增和递减运算符概述 5.2 递增运算符 5.2.1 前置递增运算符 5.2.2 后置递增运算符 5.2.3 后置和前置运算符的区别 6. 比较运算符 7. 逻辑运算符 7.1 逻辑运算符概述 7.2 逻辑与 7.3 逻辑或 7.4
164 0
JavaScript 入门基础 - 运算符(三)
|
存储 JSON JavaScript
JavaScript 入门基础 - 变量 / 数据类型(二)
JavaScript 入门基础 - 变量 / 数据类型(二)
116 0
JavaScript 入门基础 - 变量 / 数据类型(二)
|
JavaScript 前端开发 物联网
JavaScript 入门基础 / 概念介绍(一)
JavaScript 入门基础 / 概念介绍(一)
149 0
JavaScript 入门基础 / 概念介绍(一)
|
JavaScript 前端开发 Java
JavaScript的基础使用
JavaScript的基础 一、javascript简介 JavaScript简称js,最初由网景(现在的Mozilla)公司创建,由于商标冲突原因,其标准版本命名为ECMAScript,但是一般人们还是叫JavaScript,只在谈标准的时候说到ECMAScript这个名字。值得注意的是JavaScript与java没有任何关系,就像雷峰塔(神话中镇压白娘子的塔)和雷锋。此外js(JavaScript)和jsp(java servlet pages)也没有关系。   js的工作分为两部分,一部分属于js语言本身的特性,而另一部需要依靠宿主环境(web浏览器)才能完成。 二、javascri
JavaScript的基础使用