Website tidak jauh hubungannya dengan interaksi antara user dengan website. Website juga akan jauh lebih enak dilihat apabila dibubuhi oleh animasi-animasi sederhana. Nah interaksi dan animasi yang ada di website bisa dilakukan lewat beberapa teknologi, seperti penggunaan flash, kemudian gambar bergerak, dan lain sebagainya. Namun akhir-akhir ini penggunaan teknologi diatas tergantikan oleh kecanggihan dan ringannya penggunaan javascript sebagai alternatif utama penerapan interaktivitas dan animasi dalam suatu website.
JavaScript
Apabila teman-teman telah atau sedang belajar pemrograman website, pasti pernah menyentuh script, yang namanya JavaScript. Script ini merupakan script yang sudah berumur tua, namun terus dikembangkan oleh pengembang-pengembang browser, sehingga dapat lebih dimaksimalkan penggunaannya untuk berbagai macam hal. Apalagi akhir-akhir ini ketika penggunaan teknologi HTML5 mulai membanjiri dunia website, javascript bukan hanya menjadi element pembantu, tapi menjadi element penting terciptanya website yang interaktif.
Callback
Oke saya sudah cape mengarang kata pembuka lagi.. :p Sekarang mari kita langsung menuju ke pembahasan mengenai Callback.
Jika kita telah terbiasa menggunakan jQuery untuk membantu kita dalam membuat website yang interaktif, maka kita akan langsung tahu apa itu callback. Definisi mudahnya menurut saya, Callback adalah fungsi yang dipanggil setelah suatu fungsi dijalankan, nah callback ini bisa berupa fungsi lain, atau fungsi yang kita buat sendiri.
Mari kita melihat contoh dibawah ini, supaya lebih paham apa itu fungsi callback.
Dimulai dari menjalankan Fungsi 1 (function 1), di dalam fungsi ini akan dijalankan perulangan dari 1 sampai 2, dan akan menampilkan Alert atau pesan popup sebanyak 2 kali, dan setelah fungsi selesai (End), maka akan memanggil callback, atau fungsi selanjutnya, yaitu fungsi 2 (function 2), dalam fungsi ini akan ditampilkan Alert atau pesan popup sebanyak satu kali. Jadi jelas sekali bahwa callback itu akan dijalankan setelah fungsi pertama selesai dijalankan.
Mari Kita Praktikan!
Sekarang mari kita praktikan bagaimana untuk membuat fungsi callback yang sangat sederhana menggunakan native javascript.
Skenario dari percobaan kita adalah dengan membuat fungsi yang akan memunculkan alert atau pesan popup sebanyak 2 kali dan pesan yang akan ditampilkan dapat di-custom oleh user lewat parameter, kemudian setelah pesan popup tersebut muncul, maka akan dijalankan fungsi selanjutnya yang akan memunculkan alert atau pesan popup ketiga. Sangat mudah bukan?! Bukaaaan.. 
Oke sekarang kita akan buat fungsi pertama. Buat satu halaman html sederhana dan berikan script berikut ini.
<script>
function message(message, callback) {
// tampilkan alert sebanyak 2 kali, sesuai perulangan
for(var i=1;i<=2;i++) {
alert(message + '-' + i);
}
// jalankan parameter callback, yang merupakan fungsi yang
// telah di definisikan sebelumnya
callback();
}
</script>
Nah kita sudah berhasil membuat fungsi sederhana bernama “message”. Fungsi ini akan menampilkan pesan yang kita kirim sebanyak 2 kali (sesuai perulangan yang kita buat), kemudian setelah fungsi selesai dijalankan, maka akan dijalankan parameter callback.
Nah sekarang bagaimana sih cara menggunakan fungsi ini. Yuk kita lanjutkan praktik kita! Sekarang dibawah fungsi tersebut kita akan panggil fungsi message, berikut scriptnya.
<script>
function message(message, callback) {
// tampilkan alert sebanyak 2 kali, sesuai perulangan
for(var i=1;i<=2;i++) {
alert(message + '-' + i);
}
// jalankan parameter callback, yang merupakan fungsi yang
// telah di definisikan sebelumnya
callback();
}
message('Ini adalah pesan saya ke ', function() {
alert('Ini adalah pesan yang ditampilkan lewat callback!');
});
</script>
Nah dalam pemanggilan fungsi “message” kita melempar 2 parameter, parameter pertama adalah pesan yang akan ditampilkan, sedangkan parameter kedua adalah callback, atau fungsi yang akan dijalankan setelah fungsi message selesai dieksekusi.
Sekarang mari kita jalankan scriptnya. Simpan file yang telah kita buat, dan kemudian jalankan di browser.
Whalaaaa!!!
Gambar diatas adalah hasil dari fungsi yang dijalankan, dan gambar terakhir adalah hasil callback yang dijalankan.
Kesimpulan
Tutorial sangat sederhana diatas mengajarkan kita bagaimana cara membuat fungsi javascript yang mengandung callback. Callback bukanlah barang baru dan banyak digunakan dalam fungsi-fungsi bukan hanya javascript tapi di pemrograman lain, karena memang callback ini banyak sekali kegunaannya, terutama untuk mengeksekusi fungsi lain setelah suatu fungsi berhasil dijalankan.
Selamat mencoba!
The post Tutorial Membuat Fungsi Callback appeared first on Stoepy.