Variabel

Seringnya, aplikasi JavaScript butuh kerja dengan informasi. Di sini ada dua contoh:

1. Toko online – informasinya mungkin berisi barang-barang yang dijual dan kereta belanja.
2. Aplikasi chat – informasinya mungkin berisi user, pesan, dan banyak lagi.

Variabel digunakan untuk menyimpan informasi ini.

Variabel

Variabel ialah “simpanan bernama” untuk data. Kita bisa memakainya untuk menyimpan barang, pengunjung, dan data lain.

Untuk membuat variabel di JavaScript, gunakan katakunci let.

Pernyataan di bawah membuat (dengan kata lain: declares or defines) variabel dengan nama “message”:

let message;

Kini, kita bisa menaruh beberapa data ke dalamnya dengan menggunakan operator penetapan =:

let message;

message = 'Hello'; // simpan string

String ini kini disimpan ke area memori yang terasosiasi dengan variabel. Kita bisa mengakses itu menggunakan nama variabel:

let message;
message = 'Hello!';

alert(message); // tampilkan isi variabel

Supaya ringkas, kita bisa mengkombinasi deklarasi variabel dan penetapan ke baris tunggal:

let message = 'Hello!'; // definisikan variabel dan tetapkan nilai

alert(message); // Hello!

Kita juga bisa mendeklarasi variabel ganda dalam satu baris:

let user = 'John', age = 25, message = 'Hello';

Kelihatannya pendek, tapi itu tidak disarankan. Demi kemudahan dibaca, tolong gunakan bari tunggal per variabel.

Varian multibaris agak panjang, tapi lebih mudah dibaca:

let user = 'John';
let age = 25;
let message = 'Hello';

Beberapa orang juga mendefinisi variabel ganda dalam gaya multibaris ini:

let user = 'John',
  age = 25,
  message = 'Hello';

…Atau bahkan dalam gaya “comma-first”:

let user = 'John'
  , age = 25
  , message = 'Hello';

Secara teknis, semua varian ini melakukan hal yang sama. Jadi, cuma masaleh selera personal dan estetika saja.

var message = 'Hello';

Analogy kehidupan nyata

Kita bisa dengan mudah memahami konsep “variabel” jika kita membayangkannya sebagai “box” untuk data, dengan stiker nama yang unik.

Misalnya, variabel message bisa dibayangkan sebagai box berlabel "message" dengan nilai "Hello!" di dalamnya:

Kita bisa menaruh nilai apapun di dalam box.

Kita juga bisa mengubahnya sebanyak yang kita mau:

let message;

message = 'Hello!';

message = 'World!'; // value changed

alert(message);

Ketika nilainya berubah, data lama dihapus dari variabel:

Kita juga bisa mendeklarasi dua variabel dan mengkopi data dari satu ke yang lainnya.

let hello = 'Hello world!';

let message;

// mengkopi 'Hello world' dari hello ke message
message = hello;

// sekarang dua variabel punya data yang sama
alert(hello); // Hello world!
alert(message); // Hello world!

let message = "This";

// repeated 'let' leads to an error
// deklarasi 'let' berulang akan mengembalikan sebuah error
let message = "That"; // SyntaxError: 'message' has already been declared

Penamaan variabel

Ada dua keterbatasan pada nama variabel di JavaScript:

1. Nama hanya boleh mengandung huruf, digit, atau simbol seperti $ and _.
2. Karakter pertama tidak boleh digit.

Contoh nama valid:

let userName;
let test123;

Ketika namanya mengandung kata ganda, camelCase umum digunakan: kata demi kata digabung, setiap kata kecuali yang pertama dimulai dengan huruf kapital: myVeryLongName.

Yang menarik ialah – tanda dollar '$' dan underscore '_' juga bisa digunakan dalam nama. Mereka simbol reguler, hanya seperti huruf, tanpa makna yang spesial.

Nama-nama ini valid:

let $ = 1; // declared a variable with the name "$"
let _ = 2; // and now a variable with the name "_"

alert($ + _); // 3

Contoh nama variabel yang tidak valid:

let 1a; // cannot start with a digit

let my-name; // hyphens '-' aren't allowed in the name

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

let let = 5; // tak bisa menamai variable "let", galat!
let return = 5; // juga tak bisa menamainya "return", galat!

// note: tak ada "use strict" di contoh ini

num = 5; // variabel "num" dibuat jika ia tak ada

alert(num); // 5

"use strict";

num = 5; // galat: num tak terdefinisi

Konstan

Untuk mendeklarasi variabel konstan (tak berubah), gunakan const ketimbang let:

const myBirthday = '18.04.1982';

Variabel yang dideklarasi menggunakan const disebut “konstan”. Mereka tak bisa diubah. Jika kamu mencoba mengubahnya maka ia menghasilkan galat:

const myBirthday = '18.04.1982';

myBirthday = '01.01.2001'; // error, tak bisa menetapkan-ulang konstan!

Ketika programmer yakin bahwa variabel tak akan berubah, mereka bisa mendeklarasikan const untuk menjamin hal itu dan memberitahu semua orang.

Konstan huruf-besar

Ada kebiasaan umum untuk menggunakan konstan sebagai alias untuk nilai yang sulit dihafal yang akan diketahui sebelum dieksekusi.

Konstan macam ini dinamai dengan huruf kapital dan underscore.

Misalnya, mari kita buat konstan untuk warna dalam sesuatu yang disebut format “web” (hexadecimal):

const COLOR_RED = "#F00";
const COLOR_GREEN = "#0F0";
const COLOR_BLUE = "#00F";
const COLOR_ORANGE = "#FF7F00";

// ...ketika kita harus memilih warna
let color = COLOR_ORANGE;
alert(color); // #FF7F00

Keuntungan:

• COLOR_ORANGE lebih mudah diingat ketimbang "#FF7F00".
• Lebih rentan salah penulisan "#FF7F00" ketimbang COLOR_ORANGE.
• Ketika membaca code, COLOR_ORANGE lebih berarti daripada #FF7F00.

Kapan kita sebaiknya menggunakan kapital untuk konstan dan kapan itu dinamai dengan normal? Ayo kita perjelas.

Menjadi “konstan” hanya berarti jika nilai variable tak pernah berubah. Tapi ada konstan yang diketahui sebelum eksekusi (seperti nilai hexadecimal untuk merah) dan ada konstan yang dikalkulasi dalam run-time, selama eksekusi, tapi tak berubah setelah penetapan inisial mereka.

Misalnya:

const pageLoadTime = /* waktu yang dibutuhkan laman web untuk meload */;

Nilai pageLoadTime tidak diketahui sebelum laman diload, jadi itu dinamai dengan normal. Tapi ia masih konstan karena ia tak berubah setelah penetapan.

Dengan kata lain, konstan berhuruf kapital hanya digunakan sebagai alias untuk nilai yang “dihard-code”.

Namai dengan benar

Berbicara tentang variabel, ada satu hal yang sangat penting.

Nama variabel sebaiknya punya arti yang bersih dan jelas, yang menjelaskan data yang ia simpan.

Penamaan variabel adalah salah satu keahlian yang penting dan rumit dalam pemrograman. Pandangan sekilas pada nama variabel bisa menyingkap kode yang ditulis oleh pengembang pemula versus pengembang berpengalaman.

Di proyek nyata, kebanyakan waktu dihabiskan untuk modifikasi dan mengextend code base ketimbang menulis sesuatu yang benar-benar baru dari awal. Ketika kita kembali ke beberapa kode setelah melakukan sesuatu yang lain untuk sementara, akan lebih mudah menemukan informasi yang labelnya tepat. Atau, dengan kata lain, ketika variabel punya nama yang baik.

Tolong renungkan tentang nama yang baik untuk variabel sebelum mendeklarasinya. Itu baik untukmu.

Beberapa aturan yang baik untuk ditiru:

• Gunakan nama yang manusiawi seperti userName atau shoppingCart.
• Jauhi singkatan atau nama pendek seperti a, b, c, kecuali jika kamu benar-benar tau apa yang kamu lakukan.
• Buat nama sedeskriptif dan sejelas mungkin. Contoh nama yang jelek ialah data dan value. Nama semacam ini tidak punya makna dan hanya OK untuk menggunakannya jika data atau nilai variabel yang mengacu kontex kodenya luar biasa jelas.
• Sepakat dalam hal-hal yang ada di dalam timmu dan pikiranmu. Jika pengunjung situs disebut “user” maka kita sebaiknya menamai variabel terkait currentUser atau newUser ketimbang currentVisitor atau newManInTown.

Kedengaran simpel kan? Jelas saja, tapi membuat nama variabel descriptif dan jelas pada praktiknya tidak mudah. Coba lakukan.

Kesimpulan

Kita bisa mendeklarasi variabel untuk menyimpan data menggunakan katakunci var, let, atau const.

• let – adalah deklarasi variabel modern.
• var – adalah deklarasi variabel jadul. Normalnya kita tak menggunakannya sama sekali, tapi kita akan mengcover perbedaan halus dari let di bab Si Tua "var", hanya jika kamu membutuhkannya.
• const – seperti let, tapi nilai variabelnya tak bisa diubah.

Variabel sebaiknya diberi nama yang memudahkan kita untuk memahami apa isinya.