用js语法编写金字塔, 菱形的思路及代码

金字塔 菱形 思路及代码

(1)先打印一个星号并换行

1353901255_4757.jpg

document.write("*<br/>");

(2)打印一行6个星号

1353901481_9649.jpg

//打印一行6个
for(var i=0;i<6;i++){   
    document.write("*");  
}

(3)打印6列星号

1353901584_9891.jpg

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

(4)打印6行6列

1353901657_4669.jpg

//打印6行6列  
for(var i=0;i<6;i++){ 
    for(var j=0;j<6;j++){  
        document.write("*");  
}  
    //每打印一行后就换行  
    document.write("<br/>"); 
}

(5)金字塔型是由下面图形转成的,先打印此图形

1353901929_8818.jpg

控制内层循环的打印。观察上图,发现如下规律:

1353903052_8815.jpg

则让内层循环 j<=i,就可以实现。i控制行数,j控制列数。比如:当i=0时,内层循环1次,j=0,j<=i,当j++时,就跳出内层循环;当i=1时,内存循环2次,j=0和j=1的情况,当j=1,j++, 则j=2,j<=i则不成立,跳出内存循环。以此类推。

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

(6)当j<i,那么每行少一个星号,则第一行会被抹掉,如下图所示:

1353903639_2380.jpg

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

(7)空格和星号相结合的情况,完整金字塔就是被空格顶过去的。

打印6个空格,后跟星号

1353903812_6969.jpg

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

每行5个空格,后跟一个星号

1353903946_3662.jpg

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

以上图像的完整代码:

<html>  
    <head>  
        <script language="javascript">  
            document.write("*<br/>");  
            document.write("=========<br/>");  
            for(var i=0;i<6;i++){ //打印一行6个  
                document.write("*");  
            }  
            document.write("<br/>");  
            document.write("=========<br/>");  
            for(var i=0;i<6;i++){ //打印6列  
                document.write("*<br/>");  
            }  
            document.write("=========<br/>");  
            for(var i=0;i<6;i++){ //打印6行6列  
                for(var j=0;j<6;j++){  
                    document.write("*");  
                }  
                document.write("<br/>"); //每打印一行后就换行  
            }  
            document.write("=========<br/>");  
            for(var i=0;i<6;i++){  
                for(var j=0;j<=i;j++){  
                    document.write("*");  
                }  
                document.write("<br/>");  
            }  
            document.write("=========<br/>");  
            for(var i=0;i<6;i++){  
                for(var j=0;j<i;j++){  
                    document.write("*");  
                }  
                document.write("<br/>");  
            }  
            document.write("=========<br/>");  
            for(var i=0;i<6;i++){  
                document.write("&nbsp;");  
            }  
            document.write("*<br/>");  
            document.write("=========<br/>");  
            for(var i=0;i<6;i++){  
                for(var k=0;k<5;k++){  
                    document.write("&nbsp;");  
                }  
                document.write("*<br/>");  
            }  
        </script>  
    </head>  
    <body></body>  
</html>

有了以上的基础,下面分析打印完整金字塔型:

(8)根据下图所示,我们已经可以打印出左边的图形,然后通过控制空格,把它转成右边的图形。

1353904310_9715.jpg

观察后发现如下规律,右边图形相对于左边的图形。

1353904535_9646.jpg

行数仍然是6行,即i=6,先不考虑空格的问题,每一行星星的个数,如下所示:

1353904857_6960.jpg

可以得出:j<=(2*i-1)+1。当i=0时,j=0,打印一个星号,必须j<=,参考上面的讲解;当i=1时,j=2,因为是j<=i,j取值0,1,2,循环三次,打印3个星号。以此类推。

1353905156_6303.jpg

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

(9)在(8)的基础上,插入空格。对比发现,如下规律:

1353905406_1370.jpg

再加一层内循环,在星号内循环的前面,先打印空格,然后再打印相应的星号。

可以得出:k<6-i-1;当i=0时,k<5,k取值0,1,2,3,4,循环5次,打印5个空格。依次类推。

1353905727_7232.jpg

for(var i=0;i<6;i++){  
    for(var k=0;k<6-i-1;k++){  
        document.write("&nbsp;");  
    }  
    for(var j=0;j<=(2*i-1)+1;j++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}

(10)菱形的上半部分已经打印出,下面考虑如何打印下半部分,即打印如下的图形:

1353907439_5806.jpg

最上面的11个星号,已经在上半部分给出,只考虑打印11个星号以下的图形。

观察发现,下半部分共5行,即i=5。有如下的规律,如下图所示:

1353907701_9475.jpg

空格内存循环,k<i+1,星号内层循环,m<(9-3*i)+i。

(9-3*i)+i,是如何得出?

通过数学归纳法,发现:

1353908621_8361.jpg

1353908693_5260.jpg

for(var i=0;i<5;i++){  
    for(var k=0;k<i+1;k++){  
        document.write("&nbsp;");  
    }  
    for(var m=0;m<(9-3*i)+i;m++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}

(11)完整的菱形,通过(10)和(11),我们已经可以打印出完整的菱形。

1353908793_3840.jpg

<span style="white-space:pre"></span>

for(var i=0;i<6;i++){
    for(var k=0;k<6-i-1;k++){  
        document.write("&nbsp;");  
    }  
    for(var j=0;j<=(2*i-1)+1;j++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}  
for(var i=0;i<5;i++){  
    for(var k=0;k<i+1;k++){  
        document.write("&nbsp;");  
    }  
    for(var m=0;m<(9-3*i)+i;m++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}

1353908877_6254.jpg

完整代码如下所示:

//打印菱形的上半部分  
for(var i=0;i<6;i++){  
    for(var k=0;k<6-i-1;k++){  
        document.write("&nbsp;");  
    }  
    for(var j=0;j<=(2*i-1)+1;j++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}  
//打印菱形的下半部分  
for(var i=0;i<5;i++){  
    for(var k=0;k<i+1;k++){  
        document.write("&nbsp;");  
    }  
    for(var m=0;m<(9-3*i)+i;m++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}  
document.write("=============<br/>");  
for(var i=0;i<6;i++){  
    for(var k=0;k<6-i-1;k++){  
        document.write("&nbsp;");  
    }  
    for(var j=0;j<=(2*i-1)+1;j++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}  
document.write("=============<br/>");  
for(var i=0;i<6;i++){  
    for(var j=0;j<=(2*i-1)+1;j++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}  
document.write("=============<br/>");  
for(var i=0;i<5;i++){  
    for(var k=0;k<i+1;k++){  
        document.write("&nbsp;");  
    }  
    for(var m=0;m<(9-3*i)+i;m++){  
        document.write("*");  
    }  
    document.write("<br/>");  
}
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值