揭示双循环的工作机制
多循环语句的应用场景极其广泛，理解其工作机制有助于对循环的灵活运用。能理解双循环就能理解多循环，故此在这里以双循环为例，演示一下双循环是如何工作的。我们的假设是：外层循环四次，内层循环6次。每一次循环，我们都拼接一个字符串并赋值给一个字串（string）变量，最后将运行结果即改字串变量显示在一个div盒子里。希望通过研究代码和运行结果，能全面理解双循环的工作原理。
以下是我设计的代码：
<div id="twoFor">演示结果：</div>
<script language="javascript">
var str = "<br><br>";
for(j=0;j<4; j++){
str += "外层循环第 " + (j + 1) + "次（步进变量j值为 " + j + "）:<pre>";
for(k=0; k< 6; k++){
str += "\t内循环第 " + (k + 1) + " 次（步进变量k值为 " + k + "）<br>";
}
str += "</pre>";
}
document.getElementById('twoFor').innerHTML = str;
</script>
运行结果在下楼。
<div id="twoFor">演示结果：</div>
<script language="javascript">
var str = "<br><br>";
for(j=0;j<4; j++){
str += "外层循环第 " + (j + 1) + "次（步进变量j值为 " + j + "）:<pre>";
for(k=0; k< 6; k++){
str += "\t内循环第 " + (k + 1) + " 次（步进变量k值为 " + k + "）<br>";
}
str += "</pre>";
}
document.getElementById('twoFor').innerHTML = str;
</script>
本帖最后由 马黑黑 于 2022-3-4 14:49 编辑
代码解释：
首先，我们布局一个 id 标识号为 twoFor 的 div 盒子，双for循环结果将在这里呈现：
<div id="twoFor">演示结果：</div>
这个 div 内部已有简单的文本，运行结果在它的基础上添加。下面是JS部分，重点：
我们先声明一个字符串变量，它的值是两个 <br> 标签，意思是和 div 盒子里原有的的内容隔开来：
var str = "<br><br>";
接着进入外层循环，步进变量是 j ：
for(j=0; j<4; j++){
str += "外层循环第 " + (j + 1) + "次（步进变量j值为 " + j + "）:<pre>";
//这里是内循环代码
str += "</pre>";
}
外层循环在嵌入内层循环之前，我们先来处理一下外层循环运行的信息并将内层循环的信息放置到 <pre> 标签里以便隔开两种循环的运行结果的信息。<pre> 标签要有收尾符，所以内层循环一轮结束了，需要加上 </pre>。
循环，习惯上从 0 开始，for(j=0; j<4; j++) 语句里，j=0; 表示j这个步进变量从0开始起步，就是说第一轮循环时j的值是0；j<4; 表示j的步进不能等于也不能大于4，换言之，当它步进到4时，就终止循环；j++; 表示j的步进方式，就是每次加1的意思，换句话说就是每一轮循环结束就在原有基础上加上1。
再来理解内层循环：
for(k=0; k< 6; k++){
str += "\t内循环第 " + (k + 1) + " 次（步进变量k值为 " + k + "）<br>";
}
同理，步进变量k从0起步，到5时结束（k< 6; 表示k的增长不能等于也不能大于6），总共循环 0，1，2，3，4，5 共 6 次。我们拼接的字符串继续围绕着变量 str 展开，其中，\t 表示缩进一个 tab 键位所对应的制表符宽度值。
关于字符串拼接，变量 += 值 的方式是一种方法，它表示 变量 的值在原有基础上再增加一个值。还有一种方法在等号后面拼接：
"\t内循环第 " + (k + 1) + " 次（步进变量k值为 " + k + "）<br>"
这种拼接方式，引号里面的东东是纯字符串，加号 + 分两种情形两个意思，一种是字符串拼接符号（上一行代码中的红色部分）、用于拼接字符串，另一种是运算符号（暗橘黄色部分，就是 (k + 1) 里面的加号）、用于计算。
小提示：JS采用松散的变量方式处理相应机制。计算结果道理上属于数值类变量，与字符串串接后，对应值自动变成了字符串。
最后，再次使用字符串拼接方式，将运行结果显示在 div 盒子里：
document.getElementById('twoFor').innerHTML += str;
innerHTML 是基于dom（document）的js方法，表示内部的HTML代码，整个语句表示将 str 变量（双for运行结果的信息）串接到（+=）其上。
结合代码和运行结果，我们应能体会到：双循环中，外层循环每运行一次，内层循环就要进行一次从 0 到 N 的完整性循环。
黑黑辛苦了，外层循环每运行一次内层循环就要完整循环完全部，这句懂的。
只是那一串引号里的挺费解。还能把<br><pre>等等的也引进去呢{:4_173:} + k +就是k += ""么？ 快下班了，先把相关的链接搬过来一起看，黑黑之前发的好几个都和这个双玄幻有关联；
JS：for语句
https://www.huachaowang.com/forum.php?mod=viewthread&tid=56663&fromuid=2
(出处: 花潮论坛)
JS：双循环for语句之表格制作
https://www.huachaowang.com/forum.php?mod=viewthread&tid=56954&fromuid=2
(出处: 花潮论坛)
红影 发表于 2022-3-4 16:15
黑黑辛苦了，外层循环每运行一次内层循环就要完整循环完全部，这句懂的。
只是那一串引号里的挺费解。还能 ...
这是拼接字符，根据显示需要在不同的循环环节中拼接的 红影 发表于 2022-3-4 16:17
+ k +就是k += ""么？
不是。k这里是数值变量，把这个k数值变量加到字符串中。
而 k += "" 则将 k 变成字符串，不论k之前是什么类型的变量 天书先看起来，现在不懂是肯定的 马黑黑 发表于 2022-3-4 18:18
这是拼接字符，根据显示需要在不同的循环环节中拼接的
我就是循环里的那些语句不是特别清楚，双循环的含义是明白的。 马黑黑 发表于 2022-3-4 18:19
不是。k这里是数值变量，把这个k数值变量加到字符串中。
而 k += "" 则将 k 变成字符串，不论k之前是 ...
嗯嗯，前面那个是数值变量。知道了，两者是有区别的。 红影 发表于 2022-3-4 21:59
嗯嗯，前面那个是数值变量。知道了，两者是有区别的。
慢慢体会 小辣椒 发表于 2022-3-4 21:55
天书先看起来，现在不懂是肯定的
这个和做帖子还是有联系的，尤其是做复杂机制的帖子 马黑黑 发表于 2022-3-4 23:36
这个和做帖子还是有联系的，尤其是做复杂机制的帖子
我会认真学习，希望对我有用 马黑黑 发表于 2022-3-4 23:35
慢慢体会
好像先需要记住，再体会，可惜我总记不住{:4_173:} 红影 发表于 2022-3-5 10:17
好像先需要记住，再体会，可惜我总记不住
你的脑容量是万千BT级别的 小辣椒 发表于 2022-3-4 23:41
我会认真学习，希望对我有用
当你发现游泳的时候，你已经是高手了{:5_106:} 马黑黑 发表于 2022-3-5 21:51
当你发现游泳的时候，你已经是高手了
游泳啊{:4_173:}我不会 马黑黑 发表于 2022-3-5 21:35
你的脑容量是万千BT级别的
有那么大么，我咋不知道{:4_173:} 红影 发表于 2022-3-5 22:17
有那么大么，我咋不知道
你主要是没有定时整理碎片