Pengenalan Ulang Javascript

Pada bagian ini kita akan membahas sekilas dasar-dasar pemrograman Javascript untuk menyegarkan pikiran pembaca mengenai fitur umum Javascript. Kita tidak akan melihat masing-masing fitur secara terperinci, karena telah terdapat banyak pustaka yang membahas dasar pemrograman Javascript secara terperinci. Karena dirancang sebagai penyegaran saja, maka pembaca diharapkan telah memiliki pengalaman dalam pemrograman secara umum, dan mengerti perintah-perintah dasar pemrograman seperti perulangan dan percabangan.

Menggunakan Javascript

Javascript merupakan bahasa yang dirancang untuk digunakan bersamaan dengan halaman web. Karena hal ini maka secara otoamtis kita akan memerlukan browser dan dokumen HTML untuk menjalankan Javascript. Umumnya, kita akan memerlukan sebuah dokumen HTML dan satu berkas Javascript untuk menjalankan kode yang ada dalam buku ini. Mengikuti konvensi umum dalam dunia web, dokumen HTML yang kita gunakan akan diberi nama index.html, sementara berkas javascript diberi nama script.js.

Adapun isi dari index.html adalah sebagai berikut:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Dokumen HTML</title>
</head>
<body>

    <script type="text/javascript" src="script.js"></script>
</body>
</html>

Sementara isi dari script.js akan selalu berbeda, tergantung dari pembahasan kita.

Pada perkembangannya, Javascript juga dapat digunakan untuk pengembangan perangakat lunak umum tanpa memerlukan browser. Jika tertarik, anda juga dapat menggunakan Javascript melalui cara ini, misalnya jalankan kode yang ada pada contoh melalui NodeJS. Detil dari perangkat lunak pengembangan Javascript modern seperti ini dapat dibaca pada bagian “Perangkat Pengembangan Javascript Modern”.

Tipe Data Dasar

Seperti kebanyakan bahasa pemrograman lainnya, Javascript memiliki beberapa tipe data untuk dimanipulasi. Seluruh nilai yang ada dalam Javascript selalu memiliki tipe data. Tipe data yang dimiliki oleh Javascript adalah sebagai berikut:

  • Number (bilangan)

  • String (serangkaian karakter)

  • Boolean (benar / salah)

  • Object
    • Function (fungsi)
    • Array
    • Date
    • RegExp (regular expression)
  • Null (tidak berlaku / kosong)

  • Undefined (tidak didefinisikan)

Kebanyakan dari tipe data yang disebutkan di atas sama seperti tipe data sejenis pada bahasa pemrograman lainnya. Misalnya, sebuah boolean terdiri dari dua nilai saja, yaitu true dan false. Untuk mempersingkat pembahasan, kita hanya akan melihat beberapa tipe data yang menarik dari Javascript pada bagian ini, yaitu Number, String, dan Array. Number dan String akan dibahas langsung pada bagian ini, sementara Array akan dibahas setelah pembahasan variabel, karena array tidak akan terlalu berguna tanpa digunakan dengan variabel.

Tipe data lainnya, seperti Function dan Object akan dibahas secara sangat detail dan mendalam pada bab-bab selanjutnya, sementara nilai lainnya tidak akan dibahas secara mendalam.

Number (Bilangan)

Seluruh bilangan yang ada pada Javascript merupakan nilai double, tepatnya “Double-Precision 64-bit Format IEEE 754 Values” sesuai dengan yang tertulis dalam spesifikasi bahasa Javascript. Sederhananya, Javascript hanya mengenal bilangan pecahan.

Penggunaan double sebagai nilai dasar menjadikan data bilangan pada Javascript sangat menarik. Misalnya, Javascript tidak memiliki integer atau bilangan bulat. Hal ini berarti kita harus sangat berhati-hati dalam melakukan perhitungan aritmatis, misalnya untuk kode-kode seperti berikut:

1
0.1 + 0.2 // menghasilkan 0.30000000000000004

Pada prakteknya, bilangan bulat biasanya disimpan dan diperlakukan sebagai integer 32-bit. Hal ini dilakukan untuk mempermudah pengembang aplikasi dalam melakukan operasi-operasi umum terhadap integer, misalnya pergeseran bit.

Operator numerik umum untuk operasi aritmatika juga pastinya didukung oleh Javascript. Operator-operator dasar seperti +, *, -, /, dan % cara kerjanya sama dengan bahasa lain:

1
2
3
4
5
10 + 20 // menghasilkan 30
10 - 5  // menghasilkan 5
5  * 15 // menghasilkan 75
15 / 5  // menghasilkan 3
13 % 2  // menghasilkan 1

Untuk operasi aritmatika yang lebih kompleks, Javascript menyediakan objek Math:

1
2
Math.sin(3.5)  // menghasilkan -0.35078322768961984
Math.pow(2, 3) // menghasilkan 8 (2 ^ 3)

Kita juga dapat mengubah nilai string menjadi integer dengan menggunakan fungsi parseInt. Fungsi parseInt menerima dua argumen, dengan argumen pertama berupa string yang akan diubah, dan argumen kedua merupakan radiks (basis) dari nilai yang diberikan oleh parameter pertama. Contoh penggunaan parseInt adalah seperti berikut:

1
2
3
4
5
6
parseInt("123", 10); // menghasilkan 123

// Menghasilkan 255
// "100" dianggap sebagai basis 16 karena parameter kedua,
// dan nilai basis 10 dari 100 pada basis 16 adalah 255.
parseInt("100", 16);

Parameter kedua dari fungsi parseInt harus selalu diisikan karena setiap browser akan mengimplementasikan parameter standar dengan nilai yang berbeda-beda. Akan lebih aman (dan jelas) jika kita selalu mengisikan parameter kekdua dari fungsi ini.

Selain fungsi parseInt, Javascript juga memiliki fungsi parseFloat, yang melakukan hal yang sama dengan parseInt, tetapi menghasilkan nilai pecahan (float). Perbedaan lainnya adalah bahwa parseFloat akan selalu menghasilkan bilangan basis 10.

1
parseFloat("2.5323"); // menghasilkan 2.5323

Selain bilangan double, Javascript juga memiliki dua buah bilangan khusus, yaitu NaN dan Infinity. NaN merupakan singkatan dari “Not a Number” yang artinya bukan bilangan. NaN dapat dihasilkan jika terdapat perhitungan atau konversi bilangan yang tidak valid, misalnya jika kita mencoba mencari akar bilangan negatif atau mengisikan string teks ke parseInt:

1
2
Math.sqrt(-1);   // menghasilkan NaN
parseInt("abc"); // menghasilkan NaN

Bilangan khusus lainnya, yaitu Infinity, yang berarti “tidak terbatas” dihasilkan ketika kita melakukan operasi yang menghasilkan bilangan tak terhingga pada matematika. Salah satu contoh dari operasi ini yaitu membagikan bilangan dengan 0:

1
10 / 0 // menghasilkan Infinity

Untuk membantu kita dalam memastikan bilangan tidak memiliki nilai NaN atau Infinity, Javascript menyediakan fungsi isNaN dan isFinite kepada kita. Penggunaan masing-masing fungsi sendiri cukup jelas, sesuai dengan namanya:

1
2
3
4
5
6
7
isNaN(NaN);           // menghasilkan true
isNaN(Math.sqrt(-1)); // menghasilkan true
isNaN(10);            // menghasilkan false

isFinite(10);       // menghasilkan true
isFinite(10 / 0);   // menghasilkan false
isFinite(Infinity); // menghasilkan false

String

Sebuah string pada Javascript secara definisi sama dengan bahasa lain pada umumnya, yaitu kumpulan karakter. Satu hal yang menarik adalah bahwa string pada Javascript direpresentasikan dalam format Unicode 16-bit, yang artinya string Javascript mampu menampung karakter-karakter khusus seperti huruf Kanji Jepang atau teks berbahasa Arab. Format penyimpanan string ini tentunya sangat memudahkan kita ketika bekerja dengan aplikasi multi-bahasa.

Sebuah string ditandai oleh tanda petik, baik petik tunggal (') ataupun petik ganda (").

1
2
3
"Ini adalah sebuah string.";
'ini juga wtring';
"世界,你好!"; // sebuah string: "Halo, dunia!"

Contoh string yang kita jalankan pada kode di atas adalah string primitive yang dianggap sebagai tipe data dasar. Selain sebagai primitive Javascript juga memiliki string yang dianggap sebagai objek. Untungnya, karena fitur autoboxing Javascript kita tidak melihat perbedaan fungsionalitas antara string primitive dan objek. Karena hal ini string primitive maupun objek pada Javascript juga memiliki method dan properti tersendiri, layaknya bahasa pemrograman berorientasi objek lainnya, .

1
2
3
"Panjang".length;       // mengembalikan 7
"Panjang".substring(3); // mengembalikan "jang"
"halo".toUpperCase();   // mengembalikan "HALO"

Secara umum, penggunaan string pada Javascript tidak terlalu berbeda dengan string pada bahasa pemrograman lainnya. Yang selalu perlu diingat hanyalah bahwa string dalam Javascript mendukung Unicode 16-bit secara otomatis.

Variabel

Seperti pada bahasa pemrograman lainnya, variabel dalam Javascript merupakan sebuah tempat untuk menyimpan data sementara. Variabel dibuat dengan kata kunci var pada Javascript.

1
2
var a;             // a berisi undefined
var nama = "Budi"; // nama berisi "Budi"

Seperti yang dapat dilihat pada contoh di atas, ketika kita tidak mengisikan nilai apa-apa ke dalam variabel pada saat pembuatan, maka variabel tersebut berisi nilai undefined. Jika nilai variabel diambil dari sumber luar (misalnya pemanggilan fungsi), kita dapat menggunakan operator || untuk memberikan nilai standar (default) untuk menanggulangi kasus di mana fungsi tidak mengembalikan apa-apa:

1
var dataRahasia = AmbilDataRahasia() || "Data Kosong";

Pada contoh kode di atas, dataRahasia akan berisi "Data Kosong" ketika AmbilDataRahasia() tidak mengembalikan apa-apa (misalnya karena tidak ada data rahasia, atau fungsi error).

Nilai yang ada di dalam variabel dapat diganti dengan mengisikan nilai baru, dan bahkan dapat diganti tipe datanya juga.

1
2
nama = "Anton"; // nama sekarang berisi string  "Anton"
nama = 1;       // nama sekarang berisi integer 1

Walaupun kemampuan untuk menggantikan tipe data ini sangat memudahkan kita dalam mengembangkan aplikasi, fitur ini harus digunakan dengan sangat hati-hati. Perubahan tipe data yang tidak diperkirakan dengan baik dapat menyebabkan berbagai kesalahan (error) pada program, misalnya jika kita mencoba mengakses method charAt setelah mengubah tipe pada contoh di atas.

Array

Array merupakan sebuah tipe data yang digunakan untuk menampung banyak tipe data lainnya. Berbeda dengan tipe data object, array pada Javascript merupakan sebuah tipe khusus. Walaupun memiliki method dan properti, array bukanlah objek, melainkan sebuah tipe yang “mirip objek”. Untungnya, pada kebanyakan kasus, kita dapat memperlakukan array layaknya sebuah objek.

Pembuatan array dalam Javascript dilakukan dengan menggunakan kurung siku ([]):

1
var data = ["satu", "dua", "tiga"];

elemen-elemen dalam array sendiri tidak harus memiliki tipe data yang sama:

1
var dataAcak = ["satu", 2, true];

dan tentunya kita boleh membuat array di dalam array (lebih dikenal dengan istilah “array dua dimensi”):

1
var arr2 = [["satu", "dua"], ["tiga", "empat"]];

Akses elemen dalam array dilakukan dengan menggunakan kurung siku juga. Nilai yang kita berikan dalam kurung siku adalah urutan elemen penulisan array (indeks), yang dimulai dari nilai 0. Jika indeks yang diakses tidak ada, maka kita akan mendapatkan nilai undefined.

1
2
3
4
5
data[2];     // mengembalikan "tiga"
dataAcak[1]; // mengembalikan 2
arr2[0][1];  // mengembalikan "dua"

data[10];    // mengembalikan undefined

Sebagai sebuah objek khusus, array juga memiliki method dan properti. Beberapa method dan properti yang populer misalnya length, pop(), dan push(). Kegunaan dari masing-masing method maupun properti tersebut dapat ditebak dari namanya.

1
2
3
4
5
6
var data = ["a", "b", "c"];

data.length;    // mengembalikan 3

data.push("d"); // mengembalikan   4, data menjadi ["a", "b", "c", "d"]
data.pop();     // mengembalikan "d", data menjadi ["a", "b", "c"]

Pengendalian Struktur

Javascript memiliki perintah-perintah pengendalian struktur (control stucture) yang sama dengan bahasa dalam keluarga C. Perintah if dan else digunakan untuk percabangan, sementara perintah for, for-in, while, dan do-while digunakan untuk perulangan.

Percabangan bisa dikatakan sama persis dengan C atau Java:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
var gelar;

var pendidikan = "S2";
if (pendidikan === "S1") {
    gelar = "Sarjana";
} else if (pendidikan === "S2") {
    gelar = "Master";
} else if (pendidikan === "S3") {
    gelar = "Doktor";
} else {
    gelar = "Tidak Diketahui";
}

gelar; // gelar berisi "Master"

Satu hal yang perlu diperhatikan adalah bahwa kita menggunakan tiga buah sama dengan (===) pada operasi perbandingan. Javascript mendukung dua operator perbandingan sama dengan, yaitu == dan ===. Perbedaan utamanya adalah == mengubah tipe data yang dicek menjadi nilai terdekat, sementara === memastikan tipe data dari dua nilai yang dibandingkan sama. Untuk mendapatkan nilai perbandingan paling akurat, selalu gunakan === ketika mengecek nilai.

Sama seperti if, perulangan do, do-while, dan for memiliki cara pemakaian yang dapat dikatakan sama persis dengan C atau Java:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
while (true) {
    // tak pernah berhenti
}

var input;
do {
    input = get_input();
} while (inputIsNotValid(input))

for (var i = 0; i < 5; i++) {
    // berulang sebanyak 5 kali
}

Perulangan for-in memiliki dua buah kegunaan utama. Kegunaan yang pertama adalah untuk menelusuri nilai dalam array seperti pada Java:

1
2
3
4
5
var data = [1, 2, 3];
for (d in data) {
    // d akan bernilai 1, 2, dan 3
    // untuk masing-masing iterasi
}

Kegunaan kedua dari for-in adalah untuk menelusuri properti dalam objek. Kegunaan kedua ini akan dibahas secara mendetail pada bagian “Objek pada Javascript”.

comments powered by Disqus
Kembali ke bertzzie.com