• Tutorial dan Tips n Trik Komputer, Gadget dan lain-lain.
  • Review Film-film Layar Lebar, Serial TV dan lain-lain.
  • Review Gadget-gadget terbaru.

Belajar JavaScript Bagian 8 ( Function )

Friday, April 22, 2011 Labels:

clip_image002

Apa itu function?? Lha lo tanya ma gw trus gw tanya ma siapa? Function adalah bahasa inggris dari fungsi. Jelas bukan? Ok lanjut, dalam dunia pemrograman function adalah sebuah blok program yang berisi code-code dengan tujuan dan hasil tertentu yang dinyatakan dalam sebuah struktur sehingga dapat digunakan dengan mudah dan reuseable. Contoh gampangnya gini, misalkan anda ingin menghitung total gaji karyawan yang terdiri dari gaji pokok, bonus, lembur dan tunjangan, maka anda dapat merangkum seluruh proses tersebut dalam sebuah fungsi, sehingga jika anda memerlukan perhitungan gaji karyawan yang lain anda cukup memanggil fungsi tersebut tentunya dengan sedikit perubahan pada variabel-variabel pendukung.

Secara garis besar function dapat dikelompokan kedalam 3 jenis, yaitu function dengan variable, function tanpa variable, dan function dengan nilai balik.

Berikut syntax dari ketiga jenis function tersebut,

function nama_fungsi(variable 1,variable 2,...variable n)

{

code-code yang diinginkan;

}

Anda lihat pada bagian setelah nama_fungsi, disitu terdapat pernyataan variable, anda dapat memberikan variabel sebanyak yang anda mau untuk membantu fungsi tersebut menghasilkan proses sesuai dengan yang anda inginkan

Sebuah function juga dapat tidak menggunakan variabel, sehingga syntaxnya dapat seperti berikut,

function nama_fungsi()

{

code-code yang diinginkan;

}

Pada kedua syntax diatas function tidak memberikan nilai balik, apa nilai balik itu sendiri? Nilai balik adalah nilai yang dihasilkan oleh sebuah fungsi sehingga nilai balik tersebut dapat digunakan atau direkam kedalam sebuah variable. Berikut syntaxnya :

function nama_fungsi(variable 1, variable 2,...variable n)

{

code-code yang diinginkan;

}

Untuk lebih jelasnya perhatikan contoh-contoh berikut,

Code :

<html>

<head>

<title>Contoh JavaScript - Function (By. CobaLihatSaja.com)</title>

<script type="text/javascript">

function pesan()

{

alert("Welcome to CobaLihatSaja.com");

}

</script>

</head>

<body>

<h4>Contoh JavaScript - Function (By. CobaLihatSaja.com)</h4>

<input type="button" value="Click Here!" onclick="pesan()"/>

</body>

</html>

Hasil :

clip_image004

Pada contoh diatas kita membuat sebuah function tanpa menggunakan variabel, tujuannya hanya akan menampilkan sebuah pesan selamat datang jika tombol yang disediakan dklik oleh pengunjung.

Berikut contoh function yang menggunakan variable dan nilai balik sekaligus,

Code :

<html>

<head>

<title>Contoh JavaScript - Function (By. CobaLihatSaja.com)</title>

<script type="text/javascript">

var hutang_kantin=0;

var hutang_kasbon=0;

function set_hutang_kantin()

{

var x;

x=prompt("Berapa total hutang kantin anda?");

return x;

}

function set_hutang_kasbon()

{

var y;

y=prompt("Berapa total hutang kasbon anda?");

return y;

}

function hitung_hutang(hutang_kantin,hutang_kasbon)

{

var z;

hutang_kantin=set_hutang_kantin();

hutang_kasbon=set_hutang_kasbon();

z=parseInt(hutang_kantin)+parseInt(hutang_kasbon);

alert("Total Hutang anda adalah = "+z);

}

</script>

</head>

<body>

<h4>Contoh JavaScript - Function (By. CobaLihatSaja.com)</h4>

<input type="button" value="Click Here!" onclick="hitung_hutang()"/>

</body>

</html>

Hasil :

clip_image006

clip_image006[1]

clip_image008

clip_image010

Jika code diatas anda jalankan, maka anda akan disajikan sebuah tombol dan jika tombol tersebut diklik anda akan dipeintahkan untuk mengisi nilai hutang kantin dan hutang kasbon, dan terakhir akan ditampilkan jumlah total hutang anda. Mudah bukan, selamat bereksperimen!

Salam Persahabatan…….

3 comments:

dicoba said...

thanks ya

Unknown said...

sipp bos..sangat bermanfaat buat yang baru belajar seperti saya..
o iya, mohon kunjungi website saya,sapa tau agan bisa bantu2 kami di website saya..thanks :)

Unknown said...

haduh lupa,ne alamatnya gan.
http://owlscript.zz.mu/

Post a Comment

 
Coba Lihat Saja....... © 2010 | Designed by Blogger Hacks | Blogger Template by ColorizeTemplates