JavaScript入门(part7)--流程控制

学习笔记，仅供参考，有错必纠

参考自：pink老师教案

文章目录

JavaScript入门
- 流程控制
- - 流程控制概念
  - 顺序流程控制
  - 分支流程控制
  - 三元表达式
  - switch分支流程控制
  - for循环
  - 双重for循环
  - while循环
  - do while循环
  - continue/break

JavaScript入门

流程控制

流程控制概念

在一个程序执行的过程中，各条代码的执行顺序对程序的结果是有直接影响的。很多时候我们要通过控制代码的执行顺序来实现我们要完成的功能。流程控制主要有三种结构，分别是顺序结构、分支结构和循环结构，代表三种代码执行的顺序：

顺序流程控制

顺序结构是程序中最简单、最基本的流程控制，它没有特定的语法结构，程序会按照代码的先后顺序，依次执行，程序中大多数的代码都是这样执行的。

分支流程控制

分支结构

由上到下执行代码的过程中，根据不同的条件，执行不同的路径代码（执行代码多选一的过程），从而得到不同的结果。JS 语言提供了两种分支结构语句：if 语句、switch语句

if 语句

语法：

// 条件成立执行代码，否则什么也不做
if (条件表达式) {// 条件成立执行的代码语句
}

语句可以理解为一个行为，循环语句和分支语句就是典型的语句。一个程序由很多个语句组成，一般情况下，会分割成一个一个的语句。

if else语句

语法：

// 条件成立  执行 if 里面代码，否则执行else 里面的代码
if (条件表达式) {// [如果] 条件成立执行的代码
} else {// [否则] 执行的代码
}

if else if 语句

语法：

// 适合于检查多重条件。
if (条件表达式1) {语句1；
} else if (条件表达式2)  {语句2；
} else if (条件表达式3)  {语句3；....
} else {// 上述条件都不成立执行此处代码
}

三元表达式

语法：

表达式1 ? 表达式2 : 表达式3;

如果表达式1为 true ，则返回表达式2的值，如果表达式1为 false，则返回表达式3的值，简而言之，类似于 if else 的简写。

switch分支流程控制

语法：

switch(表达式){ case value1:// 表达式 等于 value1 时要执行的代码break;case value2:// 表达式 等于 value2 时要执行的代码break;default:// 表达式 不等于任何一个 value 时要执行的代码
}

注意事项：

关键字 switch 后面括号内可以是表达式或值，通常是一个变量；
关键字 case , 后跟一个选项的表达式或值，后面跟一个冒号；
switch 表达式的值会与结构中的 case 的值做比较；
如果存在匹配全等(===) ，则与该 case 关联的代码块会被执行，并在遇到 break 时停止，整个 switch 语句代码执行结束；
注意，执行case 里面的语句时，如果没有break，则继续执行下一个case里面的语句；
如果所有的 case 的值都和表达式的值不匹配，则执行 default 里的代码。

for循环

语法：

for(初始化变量; 条件表达式; 操作表达式 ){//循环体
}

名称	作用
初始化变量	通常被用于初始化一个计数器，该表达式可以使用 var 关键字声明新的变量，这个变量帮我们来记录次数。
条件表达式	用于确定每一次循环是否能被执行。如果结果是 true 就继续循环，否则退出循环。
操作表达式	用于确定每一次循环是否能被执行。如果结果是 true 就继续循环，否则退出循环。

执行过程

初始化变量，初始化操作在整个 for 循环只会执行一次。
执行条件表达式，如果为true，则执行循环体语句，否则退出循环，循环结束。
执行操作表达式，此时第一轮结束。
第二轮开始，直接去执行条件表达式（不再初始化变量），如果为 true ，则去执行循环体语句，否则退出循环。
继续执行操作表达式，第二轮结束。
后续跟第二轮一致，直至条件表达式为假，结束整个 for 循环。

举个例子

HTML代码：

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>数据类型</title><script>var limitNum = prompt('请输入一个正整数.');for (var num = 1; num <= limitNum; num++) {console.log("我是第" + num + "个数.");}</script></head><body></body></html>

页面：

控制台：

双重for循环

语法：

for (外循环的初始; 外循环的条件; 外循环的操作表达式) {for (内循环的初始; 内循环的条件; 内循环的操作表达式) {  需执行的代码;}
}

注意事项：

内层循环可以看做外层循环的循环体语句
内层循环执行的顺序也要遵循 for 循环的执行顺序
外层循环执行一次，内层循环要执行全部次数

while循环

语法：

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

执行步骤：

先执行条件表达式，如果结果为 true，则执行循环体代码；如果为 false，则退出循环；
执行循环体代码；
循环体代码执行完毕后，程序会继续判断执行条件表达式，如条件仍为true，则会继续执行循环体，直到循环条件为 false 时，整个循环过程才会结束。

do while循环

语法：

do {// 循环体代码 - 条件表达式为 true 时重复执行循环体代码
} while(条件表达式);

执行步骤：

先执行一次循环体代码；
再执行条件表达式，如果结果为true，则继续执行循环体代码，如果为false，则退出循环，继续执行后面代码。

注意：先再执行循环体，再判断，do…while循环语句至少会执行一次循环体代码。

continue/break

continue关键字用于立即跳出本次循环，继续下一次循环(本次循环体中 continue 之后的代码就会少执行一次)：

 for (var i = 1; i <= 5; i++) {if (i == 3) {console.log('跳出本次循环');continue; // 跳出本次循环，跳出的是第3次循环 }console.log('第' + i + '次循环');}

break 关键字用于立即跳出整个循环(循环结束)：

for (var i = 1; i <= 5; i++) {if (i == 3) {break; // 直接退出整个for 循环，跳到整个for下面的语句}console.log('第' + i + '次循环');
}

JavaScript入门(part7)--流程控制相关推荐

【Java从入门到天黑|03】JavaSE入门之流程控制
大家好,我是孙叫兽,本期内容给大家分享一下JavaSE入门之流程控制. 用户交互Scanner 1.Scanner对象之前我们学的基本语法中我们并没有实现程序和人的交互,但是Java给我们提供了这样 ...
Javascript知识分享——流程控制
目录前言一.流程控制二.顺序流程控制三.分支流程控制 1.if语句 2.if else 语句 3.三元表达式 4.if else if语句 5.switch语句四.循环流程控制 1.for循 ...
MVEL快速入门—MVEL流程控制和高级功能（三）
之前文章 MVEL快速入门-MVEL基础语法讲解(一) MVEL快速入门-MVEL属性和文字讲解(二) 流程控制实际上MVEL的表达形式不仅仅局限于简单的表达式,他还支持流程控制.使我们能够执行高级 ...
[JavaScript] JavaScript 运算符与流程控制
本文主要介绍switch,do-while,for-in,for-of的使用方法. 有关if-else,for,while等简单流程控制,和别的语言相似且常见,我没有自己写,本文将展示教程配套课件中的 ...
javascript学习之流程控制
流程:就是程序代码的执行顺序. 流程控制:通过规定的语句让程序代码有条件的按照一定的方式执行. 一.顺序结构按照书写顺序来执行,是程序中最基本的流程结构. 二.选择 ...
python入门之控制结构循环结构_python入门教程04-05（python语法入门之流程控制）...
本次课程介绍了流量的控制,介绍分支结构和循环结构的介绍和用法,实操介绍,我们一起来学习一下吧~~~ 一引子: 流程控制即控制流程,具体指控制程序的执行流程,而程序的执行流程分为三种结构:顺序结构(之 ...
Python语法入门之流程控制if判断
流程控制if判断文章目录流程控制if判断一引子: 二分支结构 2.1 什么是分支结构 2.2 为什么要用分支结构 2.3 如何使用分支结构 if判断: 引入三 if 判断完整语法四 if ...
跟班学习JavaScript第二天———流程控制、分支、循环、函数
复习: 1内嵌到html标签中,配合使用 2在html标签中编写js语句块,语句块必须写在标签中,可以放在html的任意地方, 2.变量和常量变量是程序运行的一段内存区域,用来存储可以改变的数据变 ...
JavaScript中的流程控制
一.程序的三种基本结构顺序结构从上到下执行的代码就是顺序结构程序默认就是由上到下顺序执行的分支结构根据不同的情况,执行对应代码循环结构循环结构:重复做一件事情二.分支结构 if语句语 ...