javascript基础-for()循环小知识

313 阅读2分钟

一、for循环执行步骤:

1:第一次执行初始化的值var i = 0,然后执行循环体条件i<arr.length进行判断,如果结果为真,那么则执行循环体内的内容;

2:第一次执行完循环体内的内容,就会找到 i++ 自增这一步,

自增之后的变量值如果还符合条件,那么就执行循环体内的内容,

注意:

从第二步开始到循环结束,都是执行变量自增--循环体条件进行判断--结果为真,
继续执行循环体内的内容。

二、循环小示例

1、需求--如何打印出一行个数为5的五角星

//思路:
// 1: 首先这是我们for循环的基础训练,那么我们可以考虑用到循环
// 2:我们可以定义一个空字符串的变量,拼接并存储我们的五角星
// 3:循环条件为5
// 4:在循环外打印
var str = ''
for(var i = 1; i <= 5; i++){
    str += '☆';
  }
 console.log(str)

2、双循环

1)打印五行,每行5个星星

//双层循环的特点是,外层循环执行一次,内层循环执行全部
// 声明一个变量用来拼接存储星星
// 换行要使用换行符 \n
for(var i = 1; i <= 5; i++){ // 负责打印5行
    for(var j = 0; j <= 5; j++){// 负责每行5个星星
        str += '☆'
    }
    // 如果一行打印五个星星,就换行
    str += ' \n'
}
console.log(str)

2)用户输入n行n列的星星

var rows = prompt('请输入行数');
var cols = prompt('请输入列数');
var str = ''; //拼接存储星星
for(var i = 0; i <= rows; i++){ // 循环行数
    for(var j = 1; j <= cols; j++){
        str += '☆';
    }
    str += '\n'; //换行
}
console.log(str)

3)打印倒三角

for(var i = 0; i <= 10s; i++){ // 循环控制行数
    for(var j = i; j <= 10; j++){ // 内循环打印个数不一样 j = i
        str += '☆';
    }
    str += '\n'; //换行
}
console.log(str)

4)正三角形

//正三角形
    for(var i = 1; i <= 9; i++){ //控制行数
        for(var j = 1; j <= i; j++){ // 控制每一行的个数
            str += '☆';
        }
        str += '\n'
    }
console.log(str)

5)九九乘法表

    for(var i = 1; i <= 9; i++){ //控制行数
        for(var j = 1; j <= i; j++){ // 控制每一行的个数
            str += j+'x'+i+ '='+ j * i;
        }
        str += '\n'
    }
console.log(str)

三、循环小结:

1for循环的目的,可以重复执行一些相同的代码;
2for循环可以重复执行些许不同的代码,因为有计数器 i++;
3for循环可以重复执行某些操作,比如算术运算符加法操作
4:双重for循环--外层循环一次,内层执行全部
5for循环是循环条件和数字直接相关的循环
6:分析比写代码更加重要