Mulai Belajar Javascript ~ Pemrograman dan Teknologi

Untuk membuat website yang menyertakan game, perhitungan dan animasi yang rumit; CSS dan HTML saja tidak cukup. Walaupun Sebenarnya CSS saat ini sudah menyediakan animasi sederhana dan HTML juga memiliki tag <operator> yang bisa digunakan untuk mengerjakan hitungan sederhana; tapi, untuk melakukan perhitungan dan animasi yg lebih rumit, javascript tetap diperlukan. Selain itu, pada HTML 5 sudah disediakan tag <canvas> yang akan memudahkan pembuatan game pada halaman web tanpa perlu lagi menggunakan plugin seperti flash atau java. Tag <canvas> akan memerlukan javascript untuk mengubah tampilan di dalamnya.

Untuk mulai belajar javascript kalian perlu tahu tentang cara penggunaan tag <script>, dan pastinya dasar penggunaan HTML. Script bukan hanya javascript. Tapi, secara default, script yang digunakan dalam banyak browser sebagai client-side script adalah Javascript yang bisa diletakkan diantara tag <head>, maupun tag <body>.

Javascript punya kemiripan dengan bahasa C dalam beberapa hal, misalnya untuk percabangan, perulangan, operator dan komentarnya. Perbedaannya ada pada variabel, function dan beberapa hal lainnya. Berikut ini adalah contoh sederhana dari javascript untuk menampilkan "hello world".

document.writeln("hello world");
alert("berhasil");

Kalian bisa meletakkan javascript secara langsung sebagai bagian dari tag <script> dalam HTML. Selain itu, kalian juga bisa meletaknnya di dalam file berekstensi .js dan menghubungkannya dengan atribut src di tag script. Jika kalian meletakkannya di dalam HTML, script di atas akan jadi seperti di bawah ini!

<HTML>
<HEAD>
    <TITLE>Belajar Javascript</TITLE>
</HEAD>
<BODY>
    <SCRIPT>
         document.writeln("hello world");
         alert("berhasil");
    </SCRIPT>
    <noscript>Maaf, browser anda tidak mendukung JavaScript!</noscript>
</BODY>
</HTML>

Saat File HTML dibuka dengan browser, kalian seharusnya akan mendapatkan tulisan sesuai nilai yang diberikan pada alert. Jika javascript tidak bisa digunakan atau mungkin dinonaktifkan, isi dari <noscript> akan ditampilkan.
Jika kalian menggunakan file, letakkan script-nya ke dalam file. HTML-nya bisa kalian tulis seperti di bawah ini!

<HTML>
<HEAD>
    <TITLE>Belajar Javascript</TITLE>
</HEAD>
<BODY>
    <SCRIPT src="nama_file.js">
    </SCRIPT>
    <noscript>Maaf, browser anda tidak mendukung JavaScript!</noscript>
</BODY>
</HTML>

Nama_file.js bisa kalian ganti dengan file yang berisi script dan berada di folder yang sama dengan file HTML-nya.

Pada contoh di atas kita menggunakan document.writeln untuk menampilkan output berupa string atau tulisan yang pada contoh di atas adalah "hello world". Selain menggunakan document write, kita bisa juga menggunakan method lain untuk menampilkan output. Beberapa method dan function untuk menampilkan output adalah:

document.write
document.writeln
console.log
alert

Hasil dari console.log mungkin tidak akan terlihat karena hasilnya memang bukan untuk ditampilkan di halaman.

Saat menggunakan document.write atau document.writeln, yang ditampilkan adalah hasilnya, dan bukan "tulisan asli". Misalnya, jika kalian menggunakan "document.write('Halo dunia<BR /> Namaku Geri')", maka <BR /> tidak akan ditampilkan, tapi <BR /> hanya akan diganti dengan pergantian baris.

<HTML>
<HEAD>
    <TITLE>Belajar Javascript</TITLE> 
</HEAD> 
<BODY>
    <SCRIPT>
        document.writeln('Halo dunia<BR /> Namaku Geri');
    </SCRIPT>
    <noscript>Maaf, browser anda tidak mendukung JavaScript!</noscript>
</BODY>
</HTML>

Seperti pada PHP, pada javascript string bisa diapit dengan kutip tunggal (') atau kutip ganda ("). Javascript juga punya beberapa kesamaan lain dengan PHP. Jadi, kalau kalian sudah belajar PHP dan beberapa bahasa pemrograman lain, seharusnya hanya akan ada sedikit hal yang dipelajari.

Satu hal lagi yang perlu dipelajari adalah tentang cara penggunaan komentar dalam program. Saya mungkin akan menggunakannya saat diperlukan. Komentar akan diperlukan untuk memberikan beberapa baris keterangan pada program. Komentar bisa diawali dengan "//" jika hanya satu baris. Jika lebih dari satu baris, komentar bisa ditulis diantara tanda /* dan */.

<html>
<head>
    <title>Belajar Javascript</title>
</head>
<body>
    <script>
        document.write('Halo dunia<br /> Namaku Geri');//baris ini berguna untuk menampilkan output
        /*Baris ini hanya komentar tidak penting.
           Komentar tidak akan mempengaruhi program sedikitpun.
           Komentar hanya dibutuhkan untuk membuat baris-baris yang terabaikan dalam program sehingga kita bisa memberikan keterangan yang kita perlukan.
       */
    </script>
    <noscript>Maaf, browser anda tidak mendukung JavaScript!</noscript>
</body>
</html>

Komentar akan berguna untuk memberi keterangan di dalam script atau kode program agar memudahkan kita untuk mengingat kegunaan baris tertentu. Selain itu, komentar tidak punya kegunaan lain karena memang tidak akan mempengaruhi hasil yang ditampilkan. Kalau kalian hanya membuat kode program atau script yang singkat mungkin di antara kalian bisa saja ada yang menyepelekan komentar. Tapi..., setelah membuat program atau script yang panjang, kalian akan mungkin menyadari pentingnya komentar jika kalian sudah lama meninggalkan script yang kalian tulis dan ingin memperbaikinya lagi.