Variabel di JavaScript

Variabel di JavaScript adalah tempat menyimpan data yang dapat digunakan kembali, mulai dari angka, teks, hingga objek, sehingga memudahkan kalian mengelola dan memproses informasi di dalam program.

Halo teman-teman, belajar memahami variabel adalah pondasi penting sebelum melangkah ke topik yang lebih kompleks dalam pemrograman web. Pada artikel ini kodelyly.com akan membahas konsep variabel JavaScript secara runtut, dari pengertian hingga praktik terbaik, agar kalian bisa menulis kode yang rapi, aman, dan mudah dirawat.

Variabel Di JavaScript: Pengertian Dan Fungsi

Variabel adalah penanda yang merujuk ke nilai. Dalam JavaScript, variabel membantu menyimpan keadaan aplikasi, menghindari pengulangan, serta membuat kode lebih mudah dibaca. Dengan variabel, kalian bisa mengambil input pengguna, menghitung total belanja, sampai mengatur tampilan antarmuka secara dinamis.

Contoh sederhana:

let nama = "Rani";
const tahunLahir = 2002;
let umur = 2025 - tahunLahir;
console.log(`Halo ${nama}, umurmu ${umur}`);

Perbedaan Var, Let, Dan Const

JavaScript modern menyarankan penggunaan let dan const dibanding var karena perilaku scope dan hoisting yang lebih mudah diprediksi.

Tabel ringkas perbandingan:

Khusus const pada objek atau array, referensinya tetap, tetapi isi propertinya masih bisa dimodifikasi.

const user = { nama: "Rani", kota: "Makassar" };
user.kota = "Gowa"; // valid, karena referensi objek tidak berubah

Scope, Hoisting, Dan Reassign

Scope menentukan di mana variabel bisa diakses. let dan const bersifat block scoped, sedangkan var function scoped. Hoisting adalah perilaku pemindahan deklarasi ke atas, tetapi var diinisialisasi dengan undefined sehingga sering menimbulkan perilaku tak terduga.

console.log(a); // undefined akibat hoisting var
var a = 10;

// Block scope
{
  let b = 20;
  const c = 30;
}
// console.log(b); // error, di luar scope blok

Untuk reassign, gunakan let bila nilai akan berubah. Gunakan const untuk nilai tetap seperti konfigurasi, selector DOM, atau fungsi utilitas.

Best Practice Penamaan Variabel

Gunakan camelCase agar konsisten dengan ekosistem JavaScript. Pilih nama deskriptif yang menjelaskan tujuan nilai. Hindari singkatan yang membingungkan. Simpan satu konsep per variabel sehingga maksud program mudah dipahami reviewer dan diri kalian di masa depan.

Contoh baik:

const maxItemsPerPage = 20;
let currentPage = 1;

Contoh Kasus Sederhana

Misalkan kalian membangun keranjang belanja sederhana. Kalian bisa memadukan let dan const untuk kejelasan maksud.

const hargaItem = [20000, 15000, 5000];
let total = 0;
for (let i = 0; i < hargaItem.length; i++) {
  total = total + hargaItem[i];
}
const pajak = 0.11 * total;
const grandTotal = total + pajak;
console.log({ total, pajak, grandTotal });

FAQ: Variabel Di JavaScript

1) Kapan Sebaiknya Pakai let Dan Kapan Pakai const?

Gunakan const untuk nilai yang tidak akan di-reassign (misalnya konfigurasi, selector DOM, hasil perhitungan final). Gunakan let ketika nilainya dapat berubah sepanjang eksekusi (misalnya penghitung dalam loop atau state sementara).

const pajak = 0.11; // tidak berubah
let total = 0;      // akan berubah

2) Kenapa var Tidak Direkomendasikan Lagi?

var bersifat function-scoped dan mengalami hoisting dengan nilai awal undefined. Ini sering memicu bug karena variabel bisa diakses sebelum deklarasi. let/const lebih aman karena block-scoped dan tidak dapat digunakan sebelum dideklarasikan.

console.log(a); // undefined (hoisting var)
var a = 10;

3) Apakah const Membuat Objek/array Benar_benar Tidak Bisa Diubah?

Tidak. const mengunci referensi, bukan isinya. Kalian tidak bisa meng-assign objek/array baru ke variabel yang sama, tetapi isi propertinya masih bisa dimodifikasi.

const user = { nama: "Rani", kota: "Makassar" };
user.kota = "Gowa"; // valid
// user = {} // ❌ TypeError: tidak boleh ganti referensi

4) Apa Itu Scope Dan Kenapa Penting?

Scope menentukan di mana variabel dapat diakses. let/const bersifat block-scoped, sehingga variabel hanya hidup di dalam { } tempat dideklarasikan. Ini mencegah tabrakan nama dan kebocoran variabel ke luar blok.

{
  let angka = 42;
}
// console.log(angka); // ❌ ReferenceError (di luar scope)

5) Bagaimana Cara Menulis Nama Variabel Yang Baik?

Pakai camelCase, deskriptif, dan satu konsep per variabel. Hindari singkatan yang tidak jelas. Tujuannya agar kode mudah dipahami tim dan diri kalian di masa depan.

const maxItemsPerPage = 20;
let currentPage = 1;

6) Contoh Singkat: Kapan Reassign Itu Dibutuhkan?

Reassign diperlukan saat nilai berubah seiring proses. Misalnya menghitung total dalam loop—nilai akan bertambah pada tiap iterasi, sehingga let cocok dipakai.

const harga = [20000, 15000, 5000];
let total = 0; // reassign di setiap iterasi
for (let i = 0; i < harga.length; i++) {
  total += harga[i];
}
const grandTotal = total * 1.11; // hasil akhir tetap

Kesimpulan

Variabel di JavaScript berfungsi sebagai penampung nilai yang membuat logika program lebih terstruktur. Gunakan let ketika nilai berubah, const saat nilai tetap, dan jauhi var demi kode yang stabil. Dengan memahami scope, hoisting, dan kebiasaan penamaan, kalian akan menulis JavaScript yang lebih jelas dan minim bug. Sekian artikel dari kodelyly.com, semoga bermanfaat dan sampai jumpa di pembahasan berikutnya.