Pengertian JavaScript

       JavaScript adalah bahasa pemrograman berbasis prototipe yang berjalan disisi klien. Jika kita berbicara dalam konteks web, sederhananya, kita dapat memahami JavaScript sebagai bahasa pemrograman yang berjalan khusus untuk di browser atau halaman web agar halaman web menjadi lebih hidup. Kalau dilihat dari suku katanya terdiri dari dua suku kata, yaitu Java dan Script. Java adalah Bahasa pemrograman berorientasi objek, sedangkan Script adalah serangkaian instruksi program.suku kata.
Secara fungsional, JavaScript digunakan untuk menyediakan akses script pada objek yang dibenamkan ( embedded ). Contoh sederhana dari penggunaan JavaScript adalah membuka halaman pop up, fungsi validasi pada form sebelum data dikirimkan ke server, merubah image kursor ketika melewati objek tertentu, dan lain lain.
Yang harus diperhatikan dalam penulisan, pengelolaan pemrograman JavaScript, diantaranya JavaScript adalah “case sensitive”, yang artinya JavaScript membedakan huruf besar dan huruf kecil. Jika Anda pernah belajar bahasa pemrograman seperti Turbo C atau C++, maka sama seperti bahasa pemrograman tersebut, dimana huruf T tidak sama dengan huruf t. Dalam bahasa pemrograman JavaScript juga, sebagai contoh fungsi perintah var tidak boleh ditulis Var dan juga tidak boleh ditulis VAR (huruf besar semua), yang benar adalah var (huruf kecil semua). Perintah lain adalah new Date tidak boleh ditulis new date (huruf kecil semua), dsb.

Kelebihan JavaScript 

        yaitu JavaScript bekerja pada sisi browser. maksudnya begini : untuk menampilkan halaman web, user menuliskan alamat web di address bar url. setelah itu, browser “mengambil” file html ( dengan file jJvaScript yang melekat padanya jika memang ada ) ke server yang beralamat di URL yang diketikan oleh user. Selesai file diambil, file ditampilkan pada browser. Nah, setelah file JavaScript berada pada browser, barulah script JavaScript tersebut bekerja.

Efek dari Javascript yang bekerja pada sisi browser ini, Javascript dapat merespon perintah user dengan cepat, dan membuat halaman web menjadi lebih responsif. JavaScript melakukan apa yang tidak bisa dilakukan oleh HTML, PHP, dan CSS : menangani hal – hal yang membutuhkan respons cepat terhadap aksi dari user.

Contoh : fungsi validasi pada form. ketika anda mengisi sebuah form yang divalidasi menggunakan JavaScript, anda mengetikkan data lalu mengetik submit, sebelum data dikirimkan ke server, data akan “dicek” terlebih dahulu pada browser menggunakan fungsi JavaScript yang ada pada halaman web. sehingga, jika memang data yang anda isikan tidak valid, daripada membuang – buang waktu dengan mengirimkan data ke server baru di validasi di server dan lalu server mengirimkan respons balik mengenai ketidak validan input data anda, lebih baik cek validasi data form dilakukan secara lokal di browser mwnggunakan fungsi JavaScript.

Lebih cepat dan lebih hemat Implementasi terpopuler saat ini dari pemrograman JavaScript adalah teknik AJAX. (Asynchronous JavaScript and XMLHTTP ). teknik ini sering digunakan oleh aplikasi berbasis web seperti Gmail, Google Reader, dan lain lain. Teknik yang membuat pertukaran data antara server dan browser terjadi di belakang layar sehingga interaksi antara user dan aplikasi web semakin responsif. 

Menampilkan Tanggal Pada Website menggunakan Javascript

            Seringkali kita melihat website atau blog pribadi yang di pasang informasi tanggal, kalender dan jam digital. Sebenarnya untuk membuat tampilan tanggal pada website tidak sesulit yang dikira, kita tinggal memasukkan beberapa script (javascript) di tempat yang akan dipasangi tanggal. Jadi deh bisa dilihat tanggal berapa sekarang. Biasanya tanggal tersebut mengambil data sesuai yang ada di tanggal komputer anda, lebih tepatnya di bios. Coba saja merubah

setingan tanggal pada komputer anda, maka tanggal yang di pasang akan ikut berubah juga. Tertarik untuk mencoba silahkan di coba javascript tanggal berikut ini, tinggal copy paste saja

untuk tampilan dengan format dd/mm/yy (contoh : 01/02/2009)

1. <script type="text/javascript"><!--  
2. var date = new Date();  
3. var d  = date.getDate();  
4. var day = (d < 10) ? '0' + d : d;  
5. var m = date.getMonth() + 1;  
6. var month = (m < 10) ? '0' + m : m;  
7. var yy = date.getYear();  
8. var year = (yy < 1000) ? yy + 1900 : yy;  
9.   
10. document.write(day + "/" + month + "/" + year);  
11. //--></script>  

Sedangkan untuk format date/month/year (contoh: 1 januari 2009)

1. <script type="text/javascript"><!--  
2. function makeArray() {  
3. for (i = 0; i<makeArray.arguments.length; i++)  
4. this[i + 1] = makeArray.arguments[i];  
5. }  
6.   
7. var months = new makeArray('Januari','Februari','Maret','April','Mei',  
8. 'Juni','Juli','Augustus','September','Oktober','November','Desember');  
9. var date = new Date();  
10. var day = date.getDate();  
11. var month = date.getMonth() + 1;  
12. var yy = date.getYear();  
13. var year = (yy < 1000) ? yy + 1900 : yy;  
14.   
15. document.write(day + " " + months[month] + " " + year);  
16. //--></script>  

Listing untuk membuat Jam digital dari javascript, Jam digital dapat dibuat menggunakan java script dengan memanfaatkan fungsi Date() dan fungsi setTimeout() untuk melakukan refresh setiap detik pada halaman. Baik langsung saja kita praktekkan. Silahkan ketik code di bawah ini kemudian simpan dengan nama jam.html dan jalankan.

1. <html>  
2. <head>  
3. <title>Jam Digital</title>  
4. <script type="text/javascript">  
5. // 1 detik = 1000  
6. window.setTimeout("waktu()",1000);    
7. function waktu() {     
8.     var tanggal = new Date();    
9.     setTimeout("waktu()",1000);    
10.     document.getElementById("output").innerHTML = tanggal.getHours()+":"+tanggal.getMinutes()+":"+tanggal.getSeconds();  
11. }  
12. </script>  
13. </head>  
14.   
15. <body bgcolor="white" text="black" onload="waktu()">  
16. <table align=center style="border:1px solid black" bgcolor="#CCCCCC"><tr><td>  
17. <div id="output">  
18. </div></td></tr>  
19. </table>  
20. </body>  
21. </html>  

Listing untuk membuat kalender dari javascript, sebagai berikut :

1. <!–
2. var hariH  = new Array(7);
3. hariH[1]   = “Minggu”;
4. hariH[2]   = “Senin”;
5. hariH[3]   = “Selasa”;
6. hariH[4]   = “Rabu”;
7. hariH[5]   = “Kamis”;
8. hariH[6]   = “Jum’at”;
9. hariH[7]   = “Sabtu”;
10.var bulanB = new Array(12);
11.bulanB[1]  = “Januari”;
12.bulanB[2]  = “Februari”;
13.bulanB[3]  = “Maret”;
14.bulanB[4]  = “April”;
15.bulanB[5]  = “Mei”;
16.bulanB[6]  = “Juni”;
17.bulanB[7]  = “Juli”;
18.bulanB[8]  = “Agustus”;
19.bulanB[9]  = “September”;
20.bulanB[10] = “Oktober”;
21.bulanB[11] = “Nopember”;
22.bulanB[12] = “Desember”;
23.var hariini = new Date();
24.var hari    = hariH[hariini.getDay() + 1];
25.var bulan   = bulanB[hariini.getMonth() + 1];
26.var tanggal = hariini.getDate();
27.var tahun   = hariini.getYear();
28.var detik   = hariini.getSeconds()
29.var menit   = hariini.getMinutes();
30.var jam     = hariini.getHours();

31.function showtip(model, delay, text)

32.{

33.if (window.document.all&&window.document.readyState==”complete”)

34.{

35.window.document.all.tooltip.innerHTML=’<marquee behavior=’+model+’ 

36.scrollamount=’+delay+’ scrolldelay=25>’+text+’</marquee>’

37.if(event.clientX > screen.width-200)

38.window.document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrol lLeft-(window.document.all.tooltip.style.pixelWidth+10)

39.else

40.window.document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10
41.window.document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10
42.window.document.all.tooltip.style.visibility=”visible”

43.}
44.}
45.function hidetip()
46.{
47.window.document.all.tooltip.style.visibility=”hidden”
48.}
49.document.write (“<div id=tooltip style=’position:absolute; visibility:hidden; 50.clip:rect(0 150 50 0); width:150px;’></div>”)
51.//–> 

 

 

Selamat mencoba. terima kasih.