【JavaScript】JavaScript 程序流程控制 ② ( 循环流程控制 | 循环要素 - 循环体 / 循环终止条件

【JavaScript】JavaScript 程序流程控制 ② ( 循环流程控制 | 循环要素 - 循环体 / 循环终止条件 | for 循环语法结构 )

文章目录

一、JavaScript 程序流程控制 - 循环流程控制
- 1、循环流程控制
- 2、循环要素 - 循环体 / 循环终止条件
- 3、for 循环语法结构 - 循环控制变量 / 循环终止条件 / 操作表达式
- 4、for 循环完整代码示例

一、JavaScript 程序流程控制 - 循环流程控制

1、循环流程控制

在程序开发中 , 经常需要执行有规律的重复代码 , 该 " 重复执行代码 " 的操作就是程序流程控制中的 " 循环流程控制 " ;

循环的目的是重复执行某些代码 ;

在这里插入图片描述

循环流程控制有以下几类 ;

for 循环 :
while 循环 :
do-while 循环 :

2、循环要素 - 循环体 / 循环终止条件

循环流程控制的要素 :

循环体 : 要重复执行的代码语句 ;
循环终止条件 : 每次循环时 , 循环体是否执行 , 要看是否达成循环终止条件 , 如果未达到则继续执行本次循环 , 如果达到循环终止条件则终止循环 ;

上述 " 循环体 " 和 " 循环终止条件 " 组成了完整的循环语句 ;

3、for 循环语法结构 - 循环控制变量 / 循环终止条件 / 操作表达式

下面是 for 循环的语法结构 :

for (initialization; condition; operate-expression) {  
  // 循环体，只要条件为真就会执行这里的代码  
}

initialization : 循环控制变量的初始化表达式 ;
condition : 循环终止条件 , 如果该条件为 false 则继续执行循环 , 如果该表达式为 true 则退出循环 ;
operate-expression : 操作表达式 , 循环控制变量的变化方式 , 一般是递增 / 递减运算符运算 ;

代码示例 :

循环控制变量定义 : var i = 0
循环终止条件 : i < 100
循环控制变量变化方式 : i++

        // 循环控制变量定义 : var i = 0
        // 循环终止条件 : i < 100
        // 循环控制变量变化方式 : i++
        for (var i = 0; i < 100; i++) {
            // 循环体
            console.log("循环 " + i);
        }

4、for 循环完整代码示例

完整代码示例 :

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style></style>
    <script>
        // 循环控制流程

        // 循环控制变量定义 : var i = 0
        // 循环终止条件 : i < 100
        // 循环控制变量变化方式 : i++
        for (var i = 0; i < 100; i++) {
            // 循环体
            console.log("循环 " + i);
        }
    </script>
</head>

<body>
</body>

</html>