Memahami Dasar Pemrograman Web Klien

VARIABEL

Variable adalah suatu obyek yang berisi data data, yang mana dapat dimodifikasi selama eksekusi program. Di Javascript terdapat beberapa kriteria untuk penamaan variabel, seperti ditunjukkan berikut ini.

-       Nama variabel harus dimulai oleh satu huruf (huruf besar maupun huruf kecil) atau satu karakter _ (garis bawah).

-       Nama variabel bisa terdiri dari kombinasi huruf, angka atau karakter _ dan $ (spasi kosong tidak diperbolehkan).

-       Nama variabel tidak boleh memakai nama-nama yang termasuk ke dalam kata kunci bahasa Javascript.

Berikut ini merupakan daftar kata kunci yang ada di Javascript.

Sumber: kompilasi https://developer.mozilla.org  dan http://msdn.microsoft.com.

Berikut ini adalah contoh pemberian nama variabel yang benar dan tidak benar:

Nama variabel yang benar

-       umur

-       namaLengkap

-       luas_lingkaran

-       jari2

-       _7an

-       $biaya

Nama variabel yang tidak benar

-       Nama Lengkap                       à        Ada spasi kosong

-       7ruangan                                 à        Dimulai dgn angka

-       email@website.com               à        Karakter @

-       top-level-domain                     à        Karakter -

-       function                                   à        Kata kunci Javascript

Di Javascript kita menggunakan sistem case sensitive yang artinya membedakan nama variabel dengan huruf besar dan huruf kecil, oleh karena itu biasakanlah memberikan nama variabel dengan aturan yang sama.

Ada beberapa teknik pemberian nama yang dapat digunakan, diantaranya adalah

-       Camel Case, dengan teknik untuk nama variabel yang lebih dari satu kata akan digabungkan tanpa garisbawah dan setiap huruf pertama dari tiap kata dituliskan dalam huruf kapital. Sedangkan untuk huruf pertama dari kata pertama dapat juga ditulisakan menggunakan huruf kecil. Contoh: AsalSekolah, SuhuUdara, luasPersegiPanjang, namaLengkap, dan sebagainya.

-       Notasi Hungaria, disini diawal dari nama variabel akan ditambahkan tipe data yang ditampungnya, seterusnya dapat menggunakan notasi camel case. Contoh: stringNamaLengkap (atau lebih pendek, strNamaLengkap, string menunjukkan variabel ini berisi data alfanumerik), intUmur (int menunjukkan variabel ini menyimpan bilangan bulat), dan sebagainya.

-       Selain dengan camel case, variabel dengan nama lebih dari satu kata dapat juga dibuat dengan menambahkan garisbawah sebagai penghubung antar katanya. Contoh: asal_sekolah, luas_persegi, nama_lengkap, dan sebagainya.

PEMBUATAN VARIABEL

Penulisan variabel Javascript sangatlah fleksibel, dan tidaklah terlalu rumit dan ketat, sehingga akan jarang menerima pesan error karena variabel yang tidak sesuai.

Ada dua istilah yang biasa digunakan dalam pembuatan variabel, yakni deklarasi dan inisialisasi. Deklarasi digunakan untuk menunjukkan proses permintaan alokasi memori oleh Javascript ke sistem operasi. Sedangkan inisialisasi digunakan untuk memberikan nilai awal bagi variabel tersebut.

Format deklarasi (pembuatan) variabel di Javascript adalah sebagai berikut :

var nama_variabel_nya ;

atau, dengan tambahan inisialisasi :

var nama_variabel = nilai ;

atau untuk deklarasi variabel lebih dari satu dalam satu baris perintah :

var nama_variabel1, nama_variabel3 = nilai_var_3, …, nama_variabelN ;

contoh :

var umur;

var panjang = 23;

var alas, tinggi;

<script language="javascript">

var nilai;

var nilai2 = 3;

nilai = 2;

document.write(nilai * nilai2);

</script>

TIPE DATA

Di javascript data yang dapat disimpan dalam suatu variabel dikelompokkan menjadi tiga jenis, yaitu :

-       Bilangan/numerik, bulat atau desimal, yang kita sebut sebagai integer atau float

-       Kata/kalimat (kumpulan huruf/karakter) : kita sebut string

-       Boolean : suatu variabel yang mempunyai dua nilai dan berfungsi untuk memeriksa suatu kondisi :

-    true : jika kondisinya benar

-    false : jika kondisinya salah

INTEGER (BILANGAN BULAT)

bilangan bulat dapat ditampilan dalam beberapa basis berikut ini :

-       Basis desimal, integer di tuliskan dalam urutan unit bilangan (dari 0 sampai dengan 9), permulaan bilangan tidak boleh dimulai oleh angka 0.

-       Basis heksadesimal, dituliskan dalam urutan unit bilangan dari 0 sampai dengan 9 atau urutan huruf dari A sampai dengan F (atau a sampai dengan f), permulaan bilangan dimulai oleh 0x atau 0X.

-       Basis oktal, dituliskan dalam urutan unit angka dari 0 sampai dengan 7, permulaan bilangan dimulai dengan angka 0.

FLOAT (BILANGAN DESIMAL)

Bilangan desimal biasa disebut juga sebagai bilangan pecahan atau bilangan yang dapatdituliskan menggunakan tanda koma. Bilangan ini juga bisa di tuliskan denganbeberapa cara berikut :

-       Bilangan bulat desimal : 895

-       Bilangan dengan tanda koma : 895,12

-       Bilangan pembagian : 27/11

-       Bilangan eksponensial : bilangan dengan tanda koma, kemudian diikuti oleh huruf e(atau E), kemudian diikuti oleh bilangan bulat yang artinya pangkat dari bilangan 10 (+ atau -, pangkat postitif atau negatif), contoh :

var a = 2.75e-2 ;

var b = 35.8E+10 ;

var c = .25e-2 ;

STRING

String adalah kumpulan dari karakter/huruf, nilai variabel string selalu diapit dengan tanda (') atau ("), kedua tanda tersebut harus digunakan secara berpasangan dan tidak bisa digunakan secara sendiri-sendiri atau bersilangan. Berikut ini adalah beberapa cara untuk mendeklarasikan variabel string :

var a = "Hallo";

var b = 'Sampai Ketemu Lagi !';

Contoh yang tidak sesuai, berikut ini :

var a = ‘Hallo”;

var v = “Sampai Ketemu Lagi !';

Ada beberapa karakter spesial yang bisa kita gunakan untuk mensimulasikan bagian dari karakter yang tidak terlihat (non visual) dan juga untuk menghindarkan kemungkinan browser "mengalami kebingungan" dalam membedakan antara string dan skripnya sendiri, karakter spesial ini menggunakan simbol antislash (\), beberapa contoh karakter spesial tersebut:

-       \n: kembali ke baris awal

-       \r: menekan tombol ENTER

-       \t: tab

-       \": tanda petik ganda

-       \': tanda petik tunggal

-       \\: karakter antislash

Contoh, misalnya kita ingin menyimpan kalimat berikut ini :

Ada apa di dalam "c:\windows\"

Kita harus menuliskannya dalam bentuk berikut ini di dalam Javascript :

var Judul = "Ada apa di dalam \"c:\\windows\\\"";

Atau bisa juga dengan cara berikut ini (menggunakan tanda petik tunggal) :

Judul = 'Ada apa di dalam "c:\\windows\\"';

Memanipulasi variabel String, dapat dilakukan dengan menggunakan metode-metode yang ada pada variabel string tersebut. Metode-metodenya dapat dilihat pada materi tentang Fungsi.

BOOLEAN

boolean adalah satu variabel khusus yang berguna untuk mengevaluasi suatu kondisi tertentu, oleh karenanya boolean mempunyai dua nilai :

-       True : diwakili oleh nilai 1

-       False : diwakili oleh nilai 0

KONVERSI JENIS VARIABEL

Meskipun Javascript memungkinkan pengaturan perubahan jenis variabel secara transparan,kadang kadang kita perlu juga untuk melakukan konversi jenis variabel secara paksa. parseInt() dan parseFloat() merupakan dua fungsi yang dapat digunakan untuk konversi ini.

Fungsi parseInt()

Fungsi ini mungkinkan merubah satu variabel yang dilewatkan dengan parameter tertentu (bisadalam bentuk string ataupun dalam bentuk bilangan dalam basis yang disebutkan di parameterkedua) menjadi bilangan bulat. Sintaksnya adalah sebagai berikut :

parseInt(string[, basis]);

Agar supaya fungsi parseInt() mengembalikan nilai bilangan bulat, maka parameter yangdilewatkan harus dimulai dengan karakter bilangan [0-9], prefiks hexadesimal 0x, dan/ataukarakter +,-,e,dan E. Selain daripada itu maka fungsi parseInt() akan mengembalikan nilai NaN(Not a Number). Jika karakter berikutnya tidak valid, maka akan diabaikan oleh fungsiparseInt(), dan akan ditampilkan terpotong jika di bagian depan karakter valid dan bagianbelakang karakter tidak valid.

Berikut ini salah satu contoh penggunaan fungsi parseInt() :

var a = "123";

var b = "456";

document.write(a+b + "<BR>"); // hasil 123456

document.write(parseInt(a)+parseInt(b) + "<BR>"); // hasil 579

Table 1. Contoh penggunaan fungsi parseInt()

Contoh	Hasil
parseInt("128.34");	128
parseInt("12.3E-6");	12
parseInt("12E+6");	12
parseInt("Halo");	NaN
parseInt("24Halo38");	24
parseInt("Halo3824");	NaN
parseInt("AF8BEF");	NaN
parseInt("0284");	284
parseInt("0284",8);	2
parseInt("AF8BEF",16);	11504623
parseInt("AB882F",16);	11241519
parseInt("0xAB882F");	11241519
parseInt("0xAB882F",16);	11241519
parseInt("00100110");	100110
parseInt("00100110",2);	38
parseInt("00100110",8);	32840
parseInt("00100110",10);	100110
parseInt("00100110",16);	1048848

Fungsi parseFloat()

Adalah satu fungsi dasar dari Javascript yang memungkinkan merubah variabel yang dilewatkandengan parameter tertentu menjadi bilangan desimal, Sintaks dari fungsi parseFloat() adalah sebagai berikut :

parseFloat(string);

Table 2. Contoh penggunaan fungsi parseFloat()

Contoh	Hasil
parseFloat("128.34");	128.34
parseFloat("128,34");	128
parseFloat("12.3E-6");	0.0000123
parseFloat("Halo");	NaN
parseFloat("24.568Halo38");	24.568
parseFloat("Halo38.24");	NaN
parseFloat("AF8BEF");	NaN
parseFloat("0284");	284
parseFloat("0xAB882F");	11241519

OPERATOR

Operator adalah simbol yang dapat digunakan untuk memanipulasi nilai suatu variabel, dengan kata lain melakukan operasi-operasi, mengevaluasi, dan lain-lainnya. Ada beberapa jenis operator :

OPERATOR PENGHITUNGAN

Operator penghitungan digunakan untuk memodifikasi nilai dari variabel secara matematika.

Table 3. contoh penggunaan fungsi Operator Perhitungan

Operator	Fungsi	Contoh	Hasil y (dengan x bernilai 7)
+	Menjumlahkan dua nilai	y = x + 3	10
-	Mengurangi nilai suatu variabel dengan nilai lain	y = x - 3	4
*	Mengalikan dua bilangan	y = x * 3	21
/	Membangi nilai suatu variabel dengan nilai lainnya	y = x / 3	2.333
=	Memberikan suatu nilai terhadap variabel dikiri operator ini	y = 7	7
%	Mencari sisa hasil bagi daru dua nilai	y = x % 3	1
+=	Menjumlahkan nilai variabel dengan nilai tertentu dan hasilnya disimpan di variabel yang sama	x += 3	10
-=, *=, /=	Memiliki prinsip yang sama dengan operator +=	x -= 3 x *= 3 x /= 3	4 21 2.333
++, --	Digunakan untuk menambahkan atau mengurangi 1 nilai suatu variable	x++ x--	8 6

OPERATOR LOGIKA (BOOLEAN)

Operator jenis ini memungkinkan kita untuk memverifikasi apakah beberapa kondisi sudah benar

Table 4.contoh penggunaan fungsi Operator Logika

Operator	Fungsi	Contoh	Hasil (dengan x = 7)
==	Membandingkan nilai di kiri dan kanan operator ini	x == 7	true, jika x bernilai 7 false, jika x bernilai bukan 7
===	Sama dengan ==, tambahannya untuk menyamakan tipe datanya juga	x === “7”	true, jika x juga adalah string bukan integer dan nilainya 7.
!=	Mengetahui apakah dua nilai tidak sama	x != 7	true, jika nilai x bukan 7 false, jika nilai x adalah 7
!==	Mencari ketidaksamaan nilai dan tipe datanya	x !== “7”	true, jika nilai bukan 7 dan x bukan string false, jika nilai x adalah 7 dan x adalah string
<	Membandingkan apakah bilangan yang dikiri lebih kecil dari yang dikanan operator	x < 7	true, jika x lebih kecil dari 7 false, jika x lebih besar atau sama dengan 7
<=	Membandingkan apakah bilangan yang dikiri lebih kecil atau sama dengan yang dikanan	x <= 7	true, jika x lebih kecil atau sama dengan 7 false, jika x lebih besar dari 7
>, >=	Prinsipnya kebalikan dari operator < dan <=
||	Logika OR untuk dua kondisi yang diberikan	x > 7 || x == 7	true, jika nilai x lebih besar dari 7 ATAU x sama dengan 7 false, jika nilai x tidak lebih besar dari 7 DAN nilai x tidak sama dengan 7
&&	Logika AND	x > 7 && x < 10	true, jika nilai x lebih besar dari 7 DAN x lebih kecil dari 10 false, jika nilai x tidak lebih besar dari 7 ATAU x tidak lebih kecil dari 10
!	Logika NOT, membalikan nilai boolean suatu variable	!(x == 7)	true, jika nilai x tidak sama dengan 7 false, jika nilai x adalah 7

OPERATOR STRING

Operator + pada data berjenis string digunakan untuk menggabungkan dua variabel/nilaistring. Perlu dicatat juga bahwa var tes ='a'+'b' adalah sama dengan var tes ='ab'.

Contoh :

var tes ='a';

var tes2 = tes +'b'; //hasilnya: tes2 akan bernilai string “ab”

PRIORITAS

Pada saat akan melakukan operasi dengan banyak operator dalam satu waktu, browser harus tahu dengan urutan mana operasi dilakukan berdasarkan prioritas dari operator. Prioritas ini menunjukkan urutan suatu operator dieksekusi oleh browser. Berikut ini adalah tabel tingkat prioritas dari seluruh operator mulai dari yang tertinggi.

Table 5. contoh penggunaan fungsi Urutan eksekusi operator

Urutan	Operator
1	. [] ()
2	++ -- - ~ ! delete new typeof void
3	* / %
4	+ - +
5	<<>>>>>
6	<<= >>= instanceof
7	== != === !==
8	&
9	^
10	|
11	&&
12	||
13	?:
14	=  += -= *= /= %= <<= >>= >>>= &= ^= |=
15	,

Contoh :

var hasil = 78 * 9 + 3;

document.write(hasil);// hasilnya: 702

document.write(“<br>”);

hasil = 78 * (9 + 3);

document.write(hasil); // hasilnya: 936