三种主要的循环语句

学前端的小白...

已于 2022-08-17 19:47:54 修改

阅读量1.3k

点赞数 2

文章标签：学习

于 2022-08-17 19:40:05 首次发布

本文链接：https://blog.csdn.net/qq_35784654/article/details/126392288

版权

循环语句

循环结构，就是根据某些给出的条件，重复的执行同一段代码

基本组成

1.初始化

2.判断条件

3.要执行的代码

4.自身改变

一、while 循环

var num = 1
while(num <= 10){
    console.log(num);
    num++
}
//先进行条件的判断，当条件成立时执行条件内的语句块
//如果没有设置判条件的数值变化，将会出现死循环，无法跳出循环，导致服务器崩溃

二、do ... whlie 循环

var num = 1
do{
    console.log(num);
    num++
}while(num <= 10)
//先进行语句的执行，再进行条件的判断，至少能执行一次语句块
//其余与while循环的规则相似

三、for 循环

var n = 100
//正序
for(var i = 1; i <= n; i++){
    document.write(i + '<br>')
}
//倒叙
for(var i = n; i >= 1; i--){
    document.write(i + '<br>')
}
//for循环在for后面的括号内必须包含需要循环的变量，变量的终止条件，值变化的表达式
//进行运行到括号内时，先运行前两步，满足的话执行语句块，再运行值变化的表达式

四、双重for循环

双重循环打印九九乘法表

for (var i = 1; i <= 9; i++) {
    for (var j = 1; j <= i; j++) {
        document.write(i + 'x' + j + '=' + i * j + ' &emsp;')
    }
    document.write('<br>')
}
/*
思路:外层循环打印行，内层循环打印列，每次内层循环结束都打印一次换行，
每个输出结果使用的是字符串的连接
*/

运行结果：

打印三角形

var n = 5
for(var i = 1 ; i <= n; i++){
    for(var j = n-i; j > 0 ; j-- ){
        document.write('&nbsp;')
    }
    for(var k = 1 ; k <= 2*i - 1 ; k++){
        document.write('*')
    }
    document.write('<br>')
}
/*
实现思路：外层循环打印行，内层两个循环，分别打印空格和* ，根据图形推出* 空格 与行的关系，带入进行            打印
*/

结果：

菱形打印：

var n = 5
for(var i = 1 ; i <= n; i++){
    for(var j = n-i; j > 0 ; j-- ){
        document.write('&nbsp;')
    }
    for(var k = 1 ; k <= 2*i - 1 ; k++){
        document.write('*')
    }
        document.write('<br>')
}
for(var i = 1 ; i <= n; i++){
    for(var k = 1 ; k <= 2*i - 1 ; k++){
        document.write('&nbsp;')
    }
    for(var j = 2 * ( n - i) -1; j > 0 ; j-- ){
        document.write('*')
    }
        document.write('<br>')
}
/*
实现思路：
    分两次外层循环，先打印上边三角形，再打印下边三角形，下边三角形思路与上面刚好相反
*/

结果：

五、循环终止语句

1.break语句

执行后直接终止循环

for(var i = 1; i <= 5; i++){
    if(i = 3){
        break
    }
    document.write(i)
}
//运算结果只会输出 1  2 
//运算到2 后进行自加运算，i值为三，进行判断，条件成立执行break语句，直接跳出整个循环