Ads by Yasya El Hakim
Mengenal dan Memahami Variabel pada JavaScript

Aplikasi JavaScript dapat bekerja dengan beberapa informasi seperti:
  • Aplikasi Online Shop - Informasinya terdiri dari produk yang dijual dan telah di tambahkan kedalam keranjang belanja.
  • Aplikasi Chat - Informasinya terdiri dari pengguna, pesan dan lain-lain.

Pada JavaScript, kita dapat menyimpan informasi tersebut dengan menggunakan Variabel.



Variabel pada JavaScript

Variabel adalah suatu penyimpanan untuk data dan kita dapat menggunakan variabel untuk menyimpan beberapa informasi atau data.

Untuk membuat sebuah variabel pada JavaScript, kita dapat menggunakan keyword let.

Statement berikut adalah untuk membuat (mendeklarasikan) variabel dengan nama "pesan":

let pesan;


Sekarang, kita dapat memasukkan data kedalamnya dengan menggunakan operator sama dengan "=":

let pesan;

pesan = 'Halo Semuanya'; // Menyimpan string kedalam variabel


String sudah disimpan ke area memori pada variabel. Sekarang, kita dapat mengaksesnya dengan menggunakan nama dari variabel tersebut:

let pesan;
pesan = 'Halo Semuanya';

alert(pesan); // Menampilkan isi dari variabel


Secara singkat, kita dapat menggabungkan deklarasi variabel dan assignment kedalam satu baris:

let pesan = 'Halo Semuanya'; // mendeklarasikan variabel dan penetapan (assigntment)

alert(pesan); // Halo Semuanya


Kita juga dapat mendeklarasikan beberapa variabel dalam satu baris:

let nama = 'Agung', umur = '22', pesan = 'Halo Semuanya';


Contoh kode diatas tampak terlihat pendek, tetapi tidak direkomendasikan. Agar kode dapat dibaca dengan mudah, kita harus menggunakan satu baris per variabel:

let nama = 'Agung';
let umur = '22';
let pesan = 'Halo Semuanya';


Terdapat juga cara mendeklarasikan beberapa variabel tetapi dengan beberapa baris seperti contoh berikut:

let nama = 'Agung',
    umur = '22',
    pesan = 'Halo Semuanya';


... Atau dengan menggunakan style koma:

let nama = 'Agung'
  , umur = '22'
  , pesan = 'Halo Semuanya';


Secara teknis, arti dari semua penulisan diatas adalah sama. Jadi, semua contoh diatas dapat kalian gunakan sesuai dengan keinginan kalian.

Menggunakan var atau let?

Pada Script lama, mungkin kalian sering melihat keyword var dan jarang melihat variabel dengan menggunakan let. Contoh:

var pesan = 'Halo Semuanya';


Keyword var hampir sama dengan let, keyword tersebut dapat mendeklarasikan sebuah variabel tetapi dengan menggunakan cara yang lama.

Terdapat sedikit perbedaan antara let dan var, tetapi tidak terlalu penting bagi kita. Kita akan membahasnya pada bagian yang akan datang.

Analogi Variabel dalam Kehidupan Nyata

Untuk memahami konsep dari variabel, kita dapat membayangkan sebuah kotak kardus yang memiliki stiker label nama diatasnya.

Contoh, kita dapat membayangkan sebuah nama variabel - yaitu stiker label, dan isi dari variabel - yaitu benda yang ada di dalam kotak kardus.

Kita dapat memasukkan apapun ke dalam kotak kardus dan juga dapat mengubah isi yang ada didalamnya dengan mudah.

Berikut adalah contoh untuk mengubah nilai dari variabel (isi pada kotak kardus):

let pesan;
pesan = 'Halo';
pesan = 'Dunia'; // Nilainya telah diubah

alert(pesan);


Ketika nilainya telah diubah, data lama akan segera dihapus dari variabel.

Kita juga dapat mendeklarasikan dua variabel dan menyalin dari satu variabel ke variabel lain. Contoh:

let halo = 'Halo Semuanya';

let pesan;

// menyalin teks 'Halo Semuanya' dari variabel halo kedalam variabel pesan
pesan = halo;

// Sekarang, dua variabel tersebut memiliki data yang sama
alert(halo); // Halo Semuanya
alert(pesan); // Halo Semuanya


Bahasa Fungsional

Sangat menarik untuk di ingat bahwa terdapat bahasa pemrograman fungsional seperti Scala atau Erlang yang tidak memperbolehkan kita untuk mengubah nilai pada variabel.

Dalam bahasa pemrograman seperti diatas, ketika suatu nilai sudah disimpan kedalam variabel, maka akan berada disana selamanya. Jika kita ingin menyimpan hal lain, bahasa pemrograman tersebut akan memaksa kita untuk membuat variabel baru (mendeklarasikan variabel baru) dan kita tidak dapat menggunakan yang lama.

Meskipun terlihat sedikit aneh, bahasa pemrograman tersebut dapat digunakan untuk development yang cukup serius.

Menamakan Variabel

Terdapat dua batasan dalam membuat nama variabel pada JavaScript antara lain:
  • Nama variabel harus mengandung huruf, angka, atau simbol $ dan _.
  • Karakter pertama dari variabel tidak boleh berupa angka.

Contoh nama variabel:

let namaLengkap;
let tes123;


Jika terdapat beberapa kata pada nama variabel, kita dapat menggunakan camelCase. camelCase adalah kata yang huruf awalnya diawali dengan huruf besar/kapital, contohnya seperti  yukBelajarJavascript.

Menariknya lagi, tanda dolar "$" dan underscore "_" juga dapat kita gunakan untuk membuat nama pada variabel. Tetapi, ketahuilah bahwa kedua simbol tersebut tidak memiliki makna khusus.

Contoh nama variabel berikut juga termasuk benar dan dapat kita gunakan:

let $ = 1; // Mendeklarasikan sebuah variabel dengan nama "$"
let _ = 2; // Mendeklarasikan sebuah variabel dengan nama "_"

alert($ + _); // 3


Berikut adalah contoh nama variabel yang salah:

let 1a; // Tidak boleh diawali dengan angka

let nama-ku; // Tidak boleh menggunakan tanda "-"


Case Sensitive

Nama variabel seperti javascript dan JavaScript adalah variabel yang berbeda.

Huruf Non-Latin pada JavaScript

Sangat diperbolehkan untuk menggunakan bahasa apapun, termasuk huruf cina, korea, dll seperti contoh berikut:

let имя = '...';
let 我 = '...';


Secara teknis, nama variabel diatas tidak akan salah atau error, tetapi terdapat tradisi internasional untuk menggunakan bahasa inggris pada nama variabel.

Nama Variabel Cadangan

Terdapat beberapa nama variabel cadangan pada JavaScript yang tidak dapat kita gunakan sebagai nama variabel karena nama variabel tersebut digunakan oleh bahasa itu sendiri.

Contoh dari nama variabel cadangan pada JavaScript adalah seperti let, class, return, dan function.

Berikut adalah contoh kode yang salah:

let let = 5; // Tidak dapat menamakan variabel dengan "let"
let return = 5; // Tidak dapat menamakan variabel dengan "return"


Assignment Tanpa Menggunakan use strict

Secara umum, kita harus mendefinisikan sebuah variabel sebelum menggunakannya. Tetapi pada cara lama, kita dapat membuat variabel dengan hanya memberikan nilai tanpa menggunakan let. Sampai sekarang, cara tersebut masih berfungsi jika kita tidak memasukkan use strict kedalam script.

// Catatan: tanpa menggunakan "use strict"

angka = 5; // Variabel "angka" tetap dibuat jika tidak ada

alert(angka); // 5


Jika menggunakan use strict, kode diatas akan menjadi error:

"use strict";

angka = 5; // error: num is not defined


Konstanta (Constant) pada JavaScript

Untuk mendeklarasikan variabel konstanta (variabel yang tidak berubah), kita dapat menggunakan const:

const ulangTahunKu = '02.11.2020';


Variabel yang di deklarasikan dengan menggunakan const dinamakan Konstanta (Constant). Konstanta tidak dapat di tentukan/di pindahkan ulang. Jika kita menentukannya ulang, maka yang akan terjadi adalah error:

const ulangTahunKu = '02.11.2020';

ulangTahunKu = '02.11.2021' // error


Ketika seorang programmer memutuskan untuk tidak akan merubah variabel, mereka dapat menggunakan const.

Konstanta dengan Huruf Kapital

Terdapat banyak hal dalam menggunakan konstanta sebagai pengingat untuk suatu nilai yang sulit untuk diingat.

Konstanta tersebut biasanya di beri nama dengan menggunakan huruf kapital dan garis bawah.

Contoh, mari kita buat sebuah nilai warna hex dengan konstanta:

const WARNA_MERAH = "#F00";
const WARNA_HIJAU = "#0F0";
const WARNA_BIRU = "#00F";
const WARNA_ORANGE = "#FF7F00";

// ... Ketika kita ingin menggunakan warna
let warna = WARNA_ORANGE;
alert(warna); // #FF7F00


Keuntungan dalam menggunakan konstanta adalah:
  • WARNA_ORANGE jauh lebih mudah untuk diingat dari pada #FF7F00.
  • Lebih mudah untuk menghindari kesalahan ketik pada warna hex #FF7F00 ketimbang WARNA_ORANGE.
  • Ketika kita melihat kode, WARNA_ORANGE lebih mudah dimengerti ketimbang #FF7F00.

Panduan Penamaan Variabel

Membahas tentang variabel, terdapat suatu hal lagi yang sangat penting.

Sebuah nama dari variabel harus memiliki makna dan menjelaskan tentang data yang ada di dalamnya karena penamaan variabel adalah salah satu hal penting dalam dunia pemrograman.

Berikut adalah beberapa aturan yang dapat kalian gunakan dalam penamaan variabel:
  • Menggunakan bahasa yang dapat di baca oleh manusia seperi namaSaya atau tempatLahir.
  • Hindari nama singkatan atau nama pendek seperti a, b, c, dll kecuali jika kalian benar-benar tahu apa saja yang ingin kalian lakukan.
  • Buatlah nama variabel yang jelas dan singkat.

Terlihat mudah bukan? Memang mudah, tetapi, kalian akan merasakan hal sulitnya jika kalian langsung terjun kedalamnya.

0Komentar

Sebelumnya Selanjutnya