Diperbarui tanggal 3/07/2016

Fungsi Prosedur dan Modularisasi dalam Javascript

kategori Javascript / tanggal diterbitkan 2 Juli 2016 / dikunjungi: 3.72rb kali

Serangkaian perintah dalam javascript yang sering digunakan untuk melakukan hal yang sama dapat dikelompakan menjadi suatu blok tersendiri yang diberi nama. Blok-blok ini disebut dengan fungsi. Dalam javascript terdapat fungsi dan prosedur yang telah disediakan oleh javascript (building in function), dan fungsi atau prosedur yang didefinisikan oleh pengembang.

Fungsi merupakan suatu blok perintah yang dapat digunakan untuk memodularisasi program. Dengan adanya fungsi ini, maka blok-blok perintah ini dapat dipanggil atau digunakan pada saat diperlukan saja.

Jika mengacu pada bahasa pemrograman secara umum, maka blok perintah yang digunakan untuk memodularisasi dibedakan menjadi prosedur dan fungsi. Namun pada javascript, tidak ada perbedaan secara khusus antara fungsi dan prosedur.

Berikut contoh fungsi dalam javascript:

function nama_hari(str){
str=parseInt(str) 
switch(str){
  case 0:
    text='Minggu'
    break
  case 1:
    text='Senin'
    break
  case 2:
    text='Selasa'
    break
  case 3:
    text='Rabu'
    break
  case 4:
    text='Kamis'
    break
  case 5:
    text='Jumat'
    break
  case 6:
    text='Sabtu'
    break
}
alert(text)
}
}

Script diatas merupakan salah satu contoh fungsi untuk menampilkan alert nama hari. Fungsi tersebut tidak dapat langsung berjalan jika tidak dipanggil terlebih dahulu. Banyak cara untuk dapat memanggil fungsi, salah satu caranya yaitu melalui tombol button. Berikut contohnya:

<button OnClick="nama_hari('<?php echo date('w');?>')">Nama Hari</button>

Script diatas akan menampilkan sebuah tombol dan jika diklik akan memanggil fungsi javascript dengan nama_hari. Berikut kode lengkapnya

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Fungsi</title>

</head>

<body>
<script>
function nama_hari(str){
 var str=parseInt(str)
 switch(str){
  case 0:
    text='Minggu'
    break
  case 1:
    text='Senin'
    break
  case 2:
    text='Selasa'
    break
  case 3:
    text='Rabu'
    break
  case 4:
    text='Kamis'
    break
  case 5:
    text='Jumat'
    break
  case 6:
    text='Sabtu'
    break
}
alert(text);
}
</script>

<h1>Fungsi dan Prosedur</h1>
<button onClick="nama_hari('<?php echo date('w');?>')">Hari ini</button>
</body>
</html>