Skip to content

循环

1.什么是循环结构

我们学习编程,使用计算机。我们需要知道计算机最大的优势和特点是什么? 是速度,计算机的计算速度极快,我们人类是无法与之媲美的,所以我们应该将一些重复性的劳动交给计算机去做,这样能够充分的利用计算机的优势又能最大程度的解放我们人类自己。

  • 循环结构:就是根据条件,确定是否需要重复执行同一段代码(注:只要条件为真就会一直执行)

  • 循环操作用于执行重复的操作,它拥有多种形式。而无论是哪一种形式其实都离不开四个组成部分:

1、循环变量:通常作为条件出现 2、条件判断:循环是否执行的依据 3、循环体:重复执行的部分 4、更新变量:防止循环成为死循环,跳出循环体的重要组成部分

2.while循环

我们来看第一种循环结构,while循环。既然是循环语句那么就必然绕不开上述的四个组成部分,不过我们可以稍微放缓一下脚步,一点点的来学习。 首先while循环语句一个循环和一段执行的代码,只要条件为真,就会不断的执行循环体的代码。

语法

javascript
    while(条件){
        // 循环体
    }

循环条件一般是以表达式的形式出现的,返回的值是Boolean类型,根据值的true/false来决定循环体是否执行。当然,如果仅仅是这样的话那么这个循环语句就不是一个完整的循环语句。 在浏览器控制台输出100次'hello world!'。

javascript
    var num = 1;// 初始化循环变量
    while(num <= 100){// 判断循环条件
        // 循环体
        console.log('第'+num+'次输出:hello world!');
        // 更新变量
        num++;
    }

上面的代码会在num变量的值等于101的时候不满足循环条件,整个循环语句运行结束,跳出循环体,程序接着往下执行。

死循环

我们在编写循环程序的时候一定要注意给循环结构留出一个出口,也就是说循环程序运行到一定的程度必须要结束,否则程序就会进入死循环死循环是指程序一直停留在某一阶段重复执行某一些操作而不会继续执行后面的代码。这种现象对内存资源的消耗是非常巨大的,正常的情况就是内存溢出

text
内存溢出(out of memory)通俗理解就是内存不够,通常在运行大型软件或游戏时,软件或游戏所需要的内存远远超出了你主机内安装的内存所承受大小,就叫内存溢出。

下面的代码就是死循环的代码。

js
  	var num = 1;// 初始化循环变量
    while(num <= 100){// 循环变量
        // 循环体
        console.log('第'+num+'次输出:hello world!');
        // 更新变量
        // num++;
    }

3.do...while循环

Do...while循环,和while循环非常相似,但是他们之前拥有一个绝对的区别点: While循环是先判断后执行,do...while循环是先执行一次再进行判断。

语法

js
    do {
        // 循环体
    }while(条件)
js
    // 正常情况
    var num = 1; // 初始化循环变量
    do{
        // 循环体
        console.log('第'+num+'次输出:hello world!');
        // 更新变量
        num++;
    }while(num <= 100); // 循环变量


    // 非常规情况,表达式的结果为false
    var num = 101;
    do{
        console.log('第'+num+'次输出:hello world!');
        num++;
    }while(num <= 100);

上面的非常规情况下,循环条件从第一次判断就是false,但是do...while循环体依然会执行一次。

关于do...while循环语句我们唯一需要清楚记得的就是它的执行顺序。

4.for循环

For循环语句是循环操作的另一种形式,可以同时初始化循环变量,设置循环条件和更新循环变量。

语法

js
   // 数字表示执行的顺序
    for( 1,初始化循环变量 ; 2,循环条件 ; 4,更新变量 ){
         3,循环体
    }
	// for循环执行流程:1-->2-->3-->4-->2-->3-->4-->2-->3-->4-->...

For循环语句比while循环语句的好处就在于使用for语句可以使得循环语句体的结构更加的清晰。

使用for循环打印100次'hello world!'

js
    for( var i=1;i<=100;i++ ){
        console.log('第'+i+'次输出:hello world!');
    }

5.for、while、do...while的区别

  • while和do...while循环体的区别?
    • 当条件为false时,while一次都不会执行,先判断再执行
    • 当条件为false时,do...while至少会执行一次,先执行再判断
  • while和for循环体的区别?
    • 循环次数确定的情况,通常选用for循环
    • 循环次数不确定的情况,通常选用while

6.断点调试

讲解

  • 说明

断点调试是指自己在程序的某一行设置一个断点,调试时,程序运行到这一行就会停住,然后你可以一步 一步往下调试,调试过程中可以看各个变量当前的值,出错的话,调试到出错的代码行即显示错误,停下。

浏览器的 Debug工具

  • 步骤
js
浏览器中按F12-->sources-->找到需要调试的文件-->在程序的某一行设置断点
  • 调试中的相关操作概念

7.break语句 和 continue语句

break语句

之前我们在switch语句中使用了break语句,用以跳出switch语句。

break语句也可以用在循环语句中,也可以跳出循环语句。

  • 需求:计算1-10整数之和,当和大于20时结束计算:
js
var sum = 0;
for( var i=1;i<100;i++ ){
    sum += i;
    if( sum>20 ){
        break;// 跳出循环
    }
}
sum;// 21

continue语句

continue和break语句类似,也是跳转的作用,可以让代码不按照既有的顺序执行。 continue是跳出本次循环,直接进入下一次循环操作。

  • 求1-100之间所有奇数之和:
js
    var sum = 0;
    for( var i=1;i<=100;i++ ){
        // 当continue语句执行,循环体中continue语句后面的所有的代码都不会执行
        // 直接进入下一次循环
        if( i %2 == 0 ) continue;
        sum += i;
    }

MIT Licensed