Variabel Javascript: Tipe, Deklarasi, dan Aturan Penamaan

Variabel dalam Javascript adalah tempat untuk diisi nilai tertentu, tempat ini diberi nama agar bisa diakses oleh kode lainnya. Sebuah variabel tidak memerlukan tipe data saat dideklarasikan, sehingga bisa diisi dengan nilai apapun dan diubah nilainya dengan tipe data yang berbeda. Jika sebuah variabel diisi dengan nilai bertipe angka, maka variabel tersebut pun bisa diisi dengan nilai bertipe string. Kondisi ini merupakan ciri dari loosely typed language.

Deklarasi Variabel Javascript

Deklarasi variabel Javascript dapat dilakukan menggunakan tiga keywords, yaitu: var, let, dan const. Penamaan variabel mengikuti aturan penamaan identifier dari artikel sebelumnya.

Var

var adalah keyword untuk membuat variabel yang telah ada sejak awal Javascript. Spesifikasi variabel yang dibuat dengn keyword var sebagai berikut:

  • bersifat mutable, atau bisa diubah nilainya setelah variabel dideklarasikan
  • Hanya memiliki dua scope, yakni Global Scope dan Local (function) Scope

Contoh var bersifat mutable:

1
2
3
var name = "kodekami.com"
console.log(name)
name = "Pemrograman Javascript" // name berubah nilainya

Contoh Scope dari var:

1
2
3
4
5
6
7
8
9
var name = "kodekami.com"
function printConsole() {
  console.log(name)
  if (true) {
    var kelas = "Belajar Pemrograman Javascript"
  }
  console.log(kelas)
}
printConsole()

keterangan:

  • baris 1: membuat variabel global menggunakan var
  • baris 3: variabel name bisa diakses dari dalam fungsi
  • baris 5: membuat variabel kelas di dalam sebuah block
  • baris 7: variabel kelas bisa diakses di luar block karena var bersifat local scope

Let

let adalah keyword deklarasi variabel yang baru diperkenalkan pada tahun 2015 (ECMAScript 2015). Spesifikasi variabel yang dibuat dengan keyword let sebagai berikut:

  • Bersifat mutable
  • Memiliki tiga scope, yakni Global Scope, Local Scope, dan Block Scope

Contoh let bersifat mutable:

1
2
3
let name = "kodekami.com"
console.log(name)
name = "Pemrograman Javascript" // name berubah nilainya

Contoh Scope dari let:

1
2
3
4
5
6
7
8
9
let name = "kodekami.com"
function printConsole() {
  console.log(name)
  if (true) {
    let kelas = "Belajar Pemrograman Javascript"
  }
  console.log(kelas) // Error: ReferenceError
}
printConsole()

keterangan:

  • baris 1: membuat variabel global menggunakan let
  • baris 3: variabel name bisa diakses dari dalam fungsi
  • baris 5: membuat variabel kelas di dalam sebuah block menggunakan let,
  • baris 7: variabel kelas TIDAK bisa diakses di luar block karena let bersifat block scope

Const

const adalah keyword deklarasi variabel yang baru diperkenalkan pada tahun 2015 (ECMAScript 2015). Mirip dengan let namun nilai dari const tidak bisa diubah. Spesifikasi variabel yang dibuat dengan keyword const sebagai berikut:

  • Bersifat immutable atau tidak bisa diubah nilainya setelah dideklarasi
  • Memiliki tiga scope, yakni Global Scope, Local Scope, dan Block Scope

Contoh const bersifat immutable:

1
2
3
const name = "kodekami.com"
console.log(name)
name = "Pemrograman Javascript" // ERROR: Assignment to constant variable

Penentuan Nama Variabel

Penentuan nama variabel bisa berupa string dengan kriteria penamaan mengikuti Aturan Penamaan Identifier.

Aturan lain yang disarankan ketika membuat nama Variabel, yakni:

  • nama variabel mutable (var dan let) mengikuti format camelCase
  • nama variabel immutable (const) mengikuti format UPPERCASE
  • nama variabel dengan underscore (_) hanya untuk variabel sementara

Variabel Hoisting

Ketika menjalankan kode Javascript, Javascript Engine melakukan dua tahap berikut ini:

  1. Parsing (menguraikan) kode
  2. Execution (eksekusi) kode

Pada tahap parsing, Javascript Engine akan memindahkan semua keyword deklarasi variabel global ke atas, atau ke atas fungsi jika di deklarasikan di dalam fungsi. Sebagai contoh tahap parsing:

Kode sebelum parsing:

1
2
3
4
5
function printConsole() {
  console.log(message)
}
printConsole()
var message = "Hello"

Kode setelah parsing:

1
2
3
4
5
6
var message // deklarasi var berpindah ke atas, diisi nilai undefined
function printConsole() {
  console.log(message) // undefined
}
printConsole()
message = "Hello" // variabel message baru diisi di sini

Tindakan pemindahan keyword variabel yang dilakukan oleh Javascript Engine ini disebut dengan variabel hoisting. Salah satu manfaat hoisting yaitu menghindari ReferrenceError akibat variabel yang didekalarsikan di akhir.

©2021, All Rights Reserved

Privacy Policy | DMCA | Telegram