双重循环的嵌套执行原理

首先，我们说一下循环嵌套的执行原理。
字面意思，循环嵌套就是循环之中，循环体也有另一个循环。也就是 for(){} 的循环体,也包含 for循环。

1. 内层循环定义循环时,往往会与外层循环有关联。
2. 内层执行循环时,外层循环变量数值保持不变的。
3. 外层循环执行一次,内层循环执行所有。

for(){
                for(){}
            }

执行程序,先执行外层 for 的循环，在执行内层的 for 循环。

for (var j = 1; j <= 5; j++) {
            for (var i = 1; i <= 5; i++) {
                console.log(`i是${i} , j是${j}`);
            }
            console.log('')
        }

例如这个小例子：
执行程序,先执行外层 j 的循环；
当 j 第一次循环时 j 是 1；

1. 此时要执行 j 的循环体 — 也就是 i 的循环；
2. i的for循环是从1-5来执行循环,然后输出内容；
3. i 的数值 是从1循环至5,j的数值始终是 1；
4. 当 i 1-5 循环结束了 执行 console.log(’’)；
5. 此时 j 的 第一次循环体完全执行完毕；
6. 执行 j 循环的步长 j++。

j 第二次循环 j 是 2；

1. 重新执行 循环体 i 从 1-5 循环 j 始终是 2 ；
2. i循环结束,执行console.log() 循环体执行结束；
3. j 的循环体执行结束, 执行 j 的步长 j++。

看到这里想必大家应该不迷糊吧！毕竟我们说的还算 细 ，哈哈。
对啦！我们遇到嵌套问题时，要注意几点情况。

1. 当 外层循环体 执行一次循环时 , 内层循环体 执行所有的循环；
2. 当 内层循环执行时,外层循环数值是保持不变的；
3. 内层循环体的循环变量,往往与外层循环变量相关联也就是 i 往往与 j 有关系

好啦！下面我们来说一下另一种嵌套情况，就是我们的子循环会跟我们的父循环产生一种 非常非常神奇的 关联。哈哈哈~~
==关联是什么呢？==请看下面的分解。嘻嘻

*
* *
* * *
* * * *
* * * * *
* * * * * *

用星号做一个三角形。首先我们分析一下我们该怎么做。
我们可以看到这个三角形是有 6 行的，看到这里我们是不是会想到 循环嵌套呢？并且还有换行

话不多说，我先把我们的代码给呈现出来哈

var e = 1;
    f = 1;
for (e = 1; e <= 6; e++) {
    for (f = 1; f <= e; f++) {
            document.write(`*&nbsp;`);
    }    
    document.write(`<br>`);
}

怎么样，这个代码能看懂吗？
不知道大家发现没有，这个代码和上面的有点不一样，大家可以找一找，找不到也没关系，一会儿我会说到的哦！
好啦，我们先看我们的外循环 也就是——> for (e = 1; e <= 6; e++) 这一部分。
从这里我们可以得到几个信息，就是我们的外循环要执行 6 次（通过 e <= 6得到的）。
接下来是 内循环——> for (f = 1; f <= e; f++) 。哎呀！我们发现这里面的 f <= e; 的这里 f 后面不是一个数，大家会不会一脸懵逼呢？ 我想以大家聪明的头脑，应该不会的。不会也没关系，现在我给大家解释解释， 现在我们可以想想，这里的 f 是小于等于 外循环的 值 e 的大小的，也就是说，当第一次执行循环时，我们的 e 是等于 1 。也就意味这内循环只需要执行一次，就结束啦！这里就达到了输出 1 个✳的要求 跳出内循环，我们可以看到外循环里面还有一个输出值，换行。至此，第一次循环完美结束。
以此类推，进行第二次循环时，e 的大小是 2 。内循环里面就要执行两次，就要输出2 个✳。
就这样我们循环执行至 e 大于 6 时。直接跳出循环，不用再执行内循环啦！
我们也就达到了我们想要的输出样式啦！ 切记：&nbsp；代表一个空格。
在这里呢。我们的内循环的循环次数不是一成不变的，是随着我们的外循环的 值 的大小变换而变化的，呈正比。