你不知道的JavaScript-循环语句

最新推荐文章于 2024-07-18 11:48:33 发布

星辰♚

最新推荐文章于 2024-07-18 11:48:33 发布

阅读量125

点赞数 1

分类专栏： web前端学习笔记文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/qq_41861161/article/details/123929821

版权

web前端学习笔记专栏收录该内容

5 篇文章 0 订阅

订阅专栏

前言：“别驻足，梦想要不停追逐，别认输，熬过黑夜才有日出，要记住，成功就在下一步，没有退路。”

文章接上篇：来了，JavaScript学习之分支语句

一、循环语句

1.JS循环的概念

循环就是重复做一件事，在程序中指的是重复执行某段代码。
循环结构是程序中一种很重要的结构，其特点是在给定的循环条件成立时，反复执行某程序段，直到循环条件不再成立为止。
举个例子如：大家每天早上7点起床，8点上课，12点吃饭，19点晚自习，21点下课，23点睡觉，第二天重复7点起床，……，直到毕业找到工作就可以跳出这个循环。

2.死循环的概念

死循环就是重复执行代码，不会停止。
死循环会造成程序卡死甚至崩溃占用大量内存等问题，我们在学习以及日后开发中应当避免写出会造成死循环的代码。

3.循环的用处

循环的用处非常广泛，特别是对大量的数据进行操作的时候，
如：求若干个数之和；（重复做加法）
求某个班全部学生的总成绩；（重复做加法）
那具体什么场景下我们才需要考虑使用循环呢？
1.当某段代码，需要重复执行时。
2.某段代码，要按照一定顺序执行，数字变化的过程。
例：现在我们在控制台输出5句“hello world”,在没有学习循环时我们会这样写。

<script>
  console.log('hello world')
  console.log('hello world')
  console.log('hello world')
  console.log('hello world')
  console.log('hello world')
</script>

运行效果如下：

那么，我们来思考一个问题5行“Hello world”我们可以用这种方法去写，但如果要输出100行、1000行“hello world”呢？我们还用上述方法吗？也可以但是效率太低了，浪费时间，这个时候就需要使用循环结构了。
具体方法在文章下面会介绍。

4.循环的分类

js中循环有很多种方式，如：while,do-while,for,for-in，for-each等。
这里我们先介绍最常见的，也是很多其他编程语言通用的三种方式：
(1.)while循环
(2.)do…while循环
(3.)for循环

二、循环语句while、do…while

1.while循环语法格式

 while(条件表达式)
 {
 当条件表达式成立时执行的代码;
 }

注意：1，while循环必须按照上述语法格式来写，只能修改表达式内容和执行代码。
2，表达式可以是常量、变量或者其他表达式，该表达式会被强制转换为boolean类型,可以理解为表达式就是循环的条件，条件成立则进入括号“{}”里面执行代码，否则不进入。
3，执行代码可以有很多行，“{}”所包含的称为循环体。
4，表达式不要一直是true，避免死循环。
5，while循环的顺序是: 先判断表达式是否为true, 若true则执行执行代码, 然后再继续判断表达式是否为true, …. 直到判断表达式为false才会跳出循环, 执行while后面的代码。

2.do…while循环语法格式

  do{
     执行代码;
    }while(表达式)

注意：1，do-while和while非常类似, 也有表达式和执行代码.
2, do-while和while的区别在于判断条件的先后不一样, while是先判断条件, 而do-while是先执行再判断; 所以不管do-while表达式的条件是否成立, 都至少会执行一次循环体。

执行顺序的问题，while是先判断do-while是先执行循环体的代码，再判断。当条件第一次就不满足时，更能体现出区别。
在开发中，while用的情况多。如果while处理逻辑比较别扭时，就需要使用do-while。

3.while、do…while实例运用

实例：使用while、do…while循环语句求出1~100的和

  <script>
  1、用while实现：
  
	var sum = 0;i=1;
	while(i<=100){
    sum+=i;
    i++;
     }
	document.write(sum);
	
	2.用do…while实现
	var sum1=0
	var n=1
	do{
	//sum1=sum+n
	sum1+=n
	n++
      }
		while(n<=100)
		console.log(sum1)


  </script>

三、循环语句for

1.for循环语法格式

   for(表达式1;表达式2;表达式3){
		执行代码
    }

注意：1.表达式1：代表循环初始值，(可以不填)
2.表达式2：循环条件
3.表达式3：循环变量的更新(自增or自减)
4.表达式1和表达式2后面的两个分号必须写。

2.for循环实例应用

1、前面有个小思考说到了输出100行、1000行“hello world要使用循环结构的问题”下面就来演示一下吧：

 for(var i=1;i<=100;i++){
  console.log("hello world")
 }

程序运行效果如图：
在这里插入图片描述
上述使用过while、do…while求1~100的和，那么换成for循环呢？

    var sum =0
       for(var i=1;i<=100;i++){
        sum+=i
       }
       console.log("1~100的和是"+sum)

程序运行结果如图:
在这里插入图片描述

3.for循环嵌套

一个循环语句内又包含另一个完整的循环语句;
三种循环都可以相互嵌套; 而for循环嵌套for循环的使用会更频繁。

for循环嵌套例子：小学的时候我们一定都背过九九乘法表，那么它可不可以使用for循环实现呢？当然可以！它是一个典型的for循环嵌套，语法格式如下：

<script>
 for(var i = 1; i<=9;i++){
          for(var j=1;j<=i;j++ ){
         //给span标签添加样式，输出内容
            document.write('<span>'+j+'*'+i+'='+i*j+'&nbsp;</span>')
          }    
          document.write("</br>")
        }
</script>

运行结果如图：
在这里插入图片描述

四、break和continue关键字

1.break关键字

break的功能：
1，在switch语句中使流程跳出switch结构。
2，在循环语句中使流程跳出当前的循环。

注意：
1, 如果已执行break语句，就不会执行循环体中位于break后的语句。
2, 在多层循环中，一个break语句只向外跳一层。

示例：
1, 判断一个数是不是合数。(指自然数中除了能被1和本身整除外，还能被其他的数整除（不包括0)的数)
2, 判断一个数是不是素数。(除了1和它本身以外不再有其他的除数整除)

2.continue关键字

continue的功能：
只能在循环语句中使用，使本次循环结束，即跳过循环体中下面尚未执行的语句，接着进行下次是否执行循环的判断。

注意：
1, continue语句只能用在循环里。
2, 对于 while 和 do-while 循环，continue 语句执行之后的动作是条件判断；对于 for 循环，随后的动作是变量更新。