Iseng ga berhadiah: bintang-bintang javascript


Lagi pusing dan masih mengumpulkan energi untuk mengerjakan tugas, karena itulah iseng-iseng saya menulis tentang fungsi untuk menampikan bintang-bintang dengan bentuk segitiga. Misalnya seperti berikut

*********                               *

 *******                               ***

  *****                               *****

   ***                               *******

    *                               *********

Dan iseng itu tidak hanya berhenti sampai di tulisan saja tetapi saya juga membuat programnya menggunakan javascript, namanya juga iseng-iseng ga berhadiah.

Misal dengan kasus n / tinggi bintang adalah 5. Maka proses dibagi menjadi 2 yaitu untuk mencetak ‘*’ dan blank space agar tampilan tampak seperti piramida dan piramida terbalik.

  • jumlah bintang tiap baris berjumlah 2*x-1 dimana x adalah nilai pada posisi baris tertentu(tergantung dari tiap-tiap kasus), misalnya pada piramida terbalik(tentu saja nilai x adalah 5 jika tinggi atau masukannya adalah 5).
  • Pada kasus piramida terbalik maka blank space bertambah satu demi satu pada tiap baris dan dimulai dari 0 sampai pada n-1.

Berikut adalah source codenya:

<html>

<head>
<title></title>
<script type="text/javascript">
function segi2atas(c){
    var tmp="";
    for(var i=c;i>0;i--){
        for(var j=1;j<=c-i;j++)
            tmp+=" ";
        for(var k=1;k<=(i*2-1);k++)
            tmp+="*";
        tmp+="\n";
    }
    return tmp;
}
function segi2bawah(c){
    var tmp="";
    for(var i=1;i<=c;i++){
        for(var j=1;j<=c-i;j++)
            tmp+=" ";
        for(var k=1;k<=(i*2-1);k++)
            tmp+="*";
        tmp+="\n";
    }
    return tmp;
}

function bintang(){
    var c = document.myform.masukan.value;
    document.myform.hasil.value = segi2atas(c)+"\n"+segi2bawah(c);
}
</script>
</head>

<body>

<form name="myform">
<input type="text" name="masukan" value="5" />
<input type="button" value="go" onclick="bintang()" />
<br />
<textarea name="hasil" cols="20" rows="15"></textarea>

</form>
</body>
</html>
del.icio.us Tags: ,,

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s