【JavaScript】10_while循环和do-while与for循环

简介: # 5、while循环## 循环语句- 通过循环语句可以使指定的代码反复执行- JS中一共有三种循环语句 while语句 do-while语句 for语句- while语句 - 语法: while(条件表达式){ 语句... } - 执行流程: while语句在执行时,会先对条件表达式进行判断, 如果结果为true,则执行循环体,执行完毕,继续判断 如果为true,则再次执行循环体,执行完毕,继续判断,如此重复 知道条件表达式结果为false时,循环结束​

5、while循环

循环语句

  • 通过循环语句可以使指定的代码反复执行
  • JS中一共有三种循环语句
    while语句
    do-while语句
    for语句
  • while语句

    • 语法:
      while(条件表达式){

      语句...

      }

    • 执行流程:
      while语句在执行时,会先对条件表达式进行判断,

      如果结果为true,则执行循环体,执行完毕,继续判断
      如果为true,则再次执行循环体,执行完毕,继续判断,如此重复
      知道条件表达式结果为false时,循环结束
      

​ 通常编写一个循环,要有三个要件

​ 1. 初始化表达式(初始化变量)

​ 2. 条件表达式(设置循环运行的条件)

​ 3. 更新表单式(修改初始化变量)

        // 当一个循环的条件表达式恒为true时,这个循环就是一个死循环,会一直执行(慎用)
        // while(true){
        //     alert('哈哈')
        // }
<script>
        // 初始化表达式
        // let a = 0

        // // 条件表达式
        // while(a < 3){
        //     console.log(a)

        //     // 更新表达式
        //     a++
        // }

        let i = 0
        while(1){
            console.log(i)
            i++

            if(i >= 5){
                break
            }
        }
</script>

练习

    <script>
        /* 
            练习:
                假设银行存款的年利率为5%,问1000块存多少年可以变成5000块
        
        */
        // 创建一个变量表示钱数
        let money = 1000

        // 1000 存一年是多少钱?
        // money *= 1.05
        // money *= 1.05
        // money *= 1.05

        // 创建一个计数器来记录循环执行的次数
        let year = 0

        // 编写循环,计算存款的年数
        while(money < 5000){
            money *= 1.05 // 循环没执行一次,就相当于钱存了一年
            year++
        }
        console.log(`需要存${year}年,最终的钱数为${money}元!`)
    </script>

6、do-while循环

do-while循环

- 语法:

do{

​ 语句...

}while(条件表达式)

执行顺序:

do-while语句在执行时,会先执行do后的循环体,

​ 执行完毕后,会对while后的条件表达式进行判断

​ 如果为false,则循环终止

​ 如果为true,则继续执行循环体,以此类推

## 和while的区别:

​ while语句是先判断再执行

​ do-while语句是先执行再判断

实质的区别:

​ do-while语句可以确保循环至少执行一次

<script>
        let i = 10
        do{
            console.log(i)
            i++
        }while(i < 5)
</script>

7、for循环

原始循环---for( ; ; )

for循环

  • for循环和while没有本质区别,都是用来反复执行代码
  • 不同点就是语法结构,for循环更加清晰
  • 语法:
    for(①初始化表达式; ②条件表达式; ④更新表达式){

    ③语句...

    }

  • 执行流程:
    ① 执行初始化表达式,初始化变量
    ② 执行条件表达式,判断循环是否执行(true执行,false终止)
    ③ 判断结果为true,则执行循环体
    ④ 执行更新表达式,对初始化变量进行修改
    ⑤ 重复②,知道判断为false为止
  • 初始化表达式,在循环的整个的生命周期中只会执行1次
  • for循环中的三个表达式都可以省略
  • 使用let在for循环的()中声明的变量是局部变量,只能在for循环内部访问
    使用var在for循环的()中声明的变量可以在for循环的外部访问
  • 创建死循环的方式:
    while(1){}
    for(;;){}
        for(let i=0; i<5; i++){
            console.log(i)
        }
相关文章
|
5月前
|
JavaScript 前端开发
JS循环for、for...of、for...in
本文介绍了JavaScript中不同的循环语句,包括传统的`for`循环、`for...of`循环用于遍历数组和类数组对象、`for...in`循环用于遍历对象的属性,并通过示例代码展示了它们的用法和区别。
72 6
JS循环for、for...of、for...in
|
4月前
|
JavaScript 前端开发
js循环有几种
js循环有几种
63 0
|
3月前
|
JavaScript
js动画循环播放特效源码(上班族的一天)
js动画循环播放特效是一段实现了包含形象的卡通小人吃、睡、电脑工作的网页动画,js循环动画,简单的画面设计。非常丝滑有意思,欢迎对此代码感兴趣的朋友前来下载参考。
43 2
|
5月前
|
前端开发 JavaScript
前端基础(八)_JavaScript循环(for循环、for-in循环、for-of循环、while、do-while 循环、break 与 continue)
本文介绍了JavaScript中的循环语句,包括for循环、for-in循环、for-of循环、while循环、do-while循环以及break和continue的使用。
193 1
前端基础(八)_JavaScript循环(for循环、for-in循环、for-of循环、while、do-while 循环、break 与 continue)
|
5月前
|
JavaScript 前端开发
JavaScript基础知识-forEach循环
关于JavaScript基础知识中forEach循环的介绍。
75 1
JavaScript基础知识-forEach循环
|
5月前
|
JavaScript 前端开发 索引
|
5月前
|
JavaScript 前端开发
JavaScript while 循环
JavaScript while 循环
25 3
|
5月前
|
JavaScript
js 循环数组取值
js 循环数组取值
|
4月前
|
JavaScript
自动循环提交js
自动循环提交js
31 0
|
3月前
|
JavaScript 前端开发
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
54 1
JavaScript中的原型 保姆级文章一文搞懂

热门文章

最新文章