長方形

首先來看看長方形
看看一個for迴圈能畫一行*的效果

         for(var j = 0;j<5;j++){
          document.write("*")
        }

那麼怎麼輸出多行這五個星號呢。
這時候可以再套一個for迴圈

  for (var i=0;i<5;i++){
       for(var j = 0;j<5;j++){
          document.write("* ")
         }document.write("<br/>")
        }
 

也就是說當外面的一個大迴圈判斷一次成立後，執行裡面的迴圈。裡面的迴圈完成一次迴圈後再到大迴圈後，大迴圈還會接著執行，依次這樣執行到判斷條件不能判斷為止。
效果如圖

這樣一個長方形就列印好了

那麼怎麼列印一個這樣的直角三角形呢

第一行輸出一個
第二行輸出兩個
第三行輸出三個
第四行輸出四個
第五行輸出五個
看一下程式碼

 for(var i=0;i<6;i++){
        for(var j=0;j<i;j++){
        document.write("*");
        }document.write("<br/>"
 
)
        }

這樣利用了一個簡單的for迴圈，每次內迴圈的東西都是隨著外面的大迴圈的i值而改變的。

這樣就實現逐行列印成直角三角形了

再來看看怎麼實現一個等腰三角形的

這個時候不僅要列印星號 還要想怎麼列印空格
這個依然還是先個一個for裡面再來個for迴圈
看清楚了，這裡是個倒立的等腰三角形

  for (var i = 5; i > 0; i--) {
            // 列印空格
            for (var k = 0; k < 5 - i; k++) {
                document.write("&nbsp"
 
);
            }
            // 列印星號
            for (var j = 0; j < 2 * i - 1; j++) {
                document.write("*")
            }
            document.write("<br/>")
        }

依然還是可以大迴圈五次，然後小迴圈裡面2*j-1個
再列印空格，第一個空格沒有，第二個列印一個空格，依次這樣五次。其實就是for迴圈巢狀，然後裡面的迴圈與大迴圈定義的值聯動。就打印出來想要的圖形了。