Alhamdulillah laptop jadulku sudah sembuh dari ngambeknya. Dan kini saya sudah bisa mulai lagi berbloging ria untuk mengisi waktu luangku dimalam hari.
Dari beberapa postingan saya terdahulu yang mengetengahkan aplikasi-aplikasi yang dibuat dengan Javascript banyak yang meminta saya untuk membuatkan ebook tentang dasar-dasar javascript. Untuk itu kali ini saya buka label baru TUTORIAL JAVASCRIPT.
Sebagai blogger selayaknya kita mengetahui barang sedikit dasar-dasar javascript karena blog yang dibangun pasti didalamnya ada bagian-bagian tertentu yang dibentuk dengan javascript. Bagaimana kalau blog dibangun tanpa javascript sedikitpun? Jawabnya bisa saja, tapi blog akan terlihat statis nggak jauh bedanya dengan document PDF.. Jadi nggak ada alasan bagi kita untuk membenci javascript.
Banyak juga yang bilang javascript membuat loading blog menjadi berat. Saya berpendapat yang bikin berat adalah ketidak tahuan dimana harus menyisipkan kode tersebut dan tidak tahu optimalisasi coding . Coba lihat web sosial media FACEBOOK atau search engine google , dia kaya akan kode javascript tingkat tinggi (AJAX) . Dan bila kita lihat JQuery itu sendiri dibangun dengan javascript.
Tutorial Javascript ini saya tulis sehubungan banyak pembaca berminat belajar Javascript, namun sangat minim tutorial yang berbahasa Indonesia, Mudah-mudahan saja gaya bahasa yang saya sampaikan mudah dimengerti.
Mungkin nanti bila semua modul sudah saya posting, akan saya compile menjadi sebuah ebook.yang bisa anda download dan bisa dipelajari secara offline.
OK mari kita mulai modul pertama BAB I - Pengenalan Javascript
A. Apa Itu Javascript
Javascript adalah bahasa pemograman yang berjalan di browser, orang-orang biasa bilang client side programming. Client di sini adalah browser, seperti: Internet Explorer, Firefox, Chrome, Opera, Safari dan sebagainya. Kode javascript biasanya disisipkan diantara kode-kode HTML.
Di mana saya bisa menulis kode javascript?
Anda bisa menulis kode javascript di teks editor seperti notepad dan sebagainya. Atau lebih baik pakai PHP editor gratis ,, bisa baca di PHP Editor Gratis buat sobat-sobat ,,,
Apakah saya butuh compiler untuk menjalankan javascript?
Tidak perlu, anda cukup menjalankan javascript menggunakan browser favorit anda. Semua browser mempunyai engine yang menginterpretasikan kode javascript kita.
B. Memulai Javascript
Oke sekarang mari kita coba mulai menulis kode javascript kita. Di sini kita menggunakan notepad++ sebagai teks editor.
Kode javascript ditulis diantara tag <script language="javascript"> dan </script>, bisa kita sisipkan di kode-kode HTML kita.
Sekarang mari kita simpan kode tersebut dengan File Name: latihan1.html, jangan lupa Save as type: Hyper Text Markup Language file, seperti gambar di bawah.
Untuk mengetesnya, sobat tinggal double klik file latihan1.html yang kita buat tadi, hasilnya akan seperti berikut:
Javascript bisa juga ditulis terpisah, contoh pada latihan1 kita tulis sebagai berikut
alert('saya pasti bisa !!!')
kemudian simpan dengan nama file latihan1 dan file type pilih javascript. File akan tersimpan dengan ekstensi .js Pemanggilan di document html adalah seperti berikut:
<script type="text/javascript" src="latihan1.js"></script>
C. Sintaks Javascript
Sintaks javascript mirip-mirip bahasa C atau java. Javascript bersifat case sensitive, artinya huruf kecil dan huruf besar adalah berbeda.
Setiap baris kode javascript dipisahkan baris baru atau bisa juga titik koma (;)
Komentar dalam javascript di awali dengan // atau ditulis diantara /* dan */
D. Variabel
Variabel di javascript bisa ditulis dengan diawali huruf atau underscore ( _ ) atau tanda dollar ( $ ).
Contoh : nama, _kelas, jumlah_pengunjung
Deklarasi variable
- Anda bisa mendeklarasi dengan menggunakan var, contoh: var x = 5, ini bersifat local dan global (bisa di akses oleh semua fungsi)
- Atau langsung deklarasikan tanpa var, contoh x=5
Contoh
<script language="javascript">
var prima = 2;
var nama = "Sakahayang";
document.write(nama);
</script> E. Operator
Operator Aritmatika
Yaitu operator untuk operasi matematika
Operator | Definisi | Contoh |
---|---|---|
+ | Penambahan | 7 + 2 = 9 |
- | Pengurangan | 7 - 2 = 5 |
* | Perkalian | 7 * 2 = 14 |
/ | Pembagian | 8 / 2 = 4 |
% | Modulus (sisa hasil pembagian) | 9 % 2 = 1 |
Contoh
<script language="javascript">
var a = 7;
var b = 2;
var c = 8;
var d = 9;
a1 = a + b;
a2 = a - b;
a3 = a * b;
a4 = c / b;
a5 = d % b;
document.write('Hasil dari 7 + 2 = ' + a1);
document.write('<br/>');
document.write('Hasil dari 7 - 2 = ' + a2);
document.write('<br/>'); document.write('Hasil dari 7 * 2 = ' + a3);
document.write('<br/>'); document.write('Hasil dari 8 / 2 = ' + a4);
document.write('<br/>'); document.write('Hasil dari 9 % 2 = ' + a5);
</script>
Operator Assignment
Seperti kebanyakan bahasa pemograman lainnya, untuk memberikan nilai kepada suatu variable menggunakan tanda sama dengan ( = )
Berikut adalah penyingkatan penulisan operator
Shorthand Operator | Artinya |
---|---|
x += y | x = x + y |
x -= y | x = x -y |
x *= y | x = x * y |
x /= y | x = x / y |
Contoh
<script language="javascript">
var x = 7;
var y = 2;
x -= y;
alert(x);
</script>
Operator Pembanding
Berguna untuk membanding nilai dari dua variable
Operator | Definisi | Contoh |
---|---|---|
== | Sama dengan | x == y |
!= | Tidak sama dengan | x != y |
> | Lebih besar dari | x > y |
< | Lebih kecil dari | x < y |
>= | Lebih besar atau sama dengan dari | x >= y |
<= | Lebih kecil atau sama dengan dari | x <= y |
Contoh :
<script language="javascript">
var x = 7;
var y = 2;
if(x > y){
alert("x lebih besar dari y");
}
</script>
var x = 7;
var y = 2;
if(x > y){
alert("x lebih besar dari y");
}
</script>
Operator Logika
Operator | Definisi | Contoh |
---|---|---|
&& | DAN | X>=7 && X<=11 |
|| | ATAU | X=5 || X = 8 |
! | BUKAN | !ekspresi |
Contoh
<script language="javascript">
var x = 76;
if(x >= 80){
alert("Nilai = A");
}else if(x >= 70 && x < 80){
alert("Nilai = B");
}else if(x >= 60 && x < 70){
alert("Nilai = C");
}else{
alert("Nilai = D");
}
</script>
var x = 76;
if(x >= 80){
alert("Nilai = A");
}else if(x >= 70 && x < 80){
alert("Nilai = B");
}else if(x >= 60 && x < 70){
alert("Nilai = C");
}else{
alert("Nilai = D");
}
</script>
Tidak ada komentar:
Posting Komentar