Variabel dan Tipe Data JavaScript

2.1. Mendeklarasikan Variabel

Variabel dan Tipe Data JavaScript

Cara mendeklarasikan sebuah variabel adalah dengan kata kunci let atau const dan diikuti dengan nama variabelnya, seperti ini:

let namaVariabel1 = "hello";
const namaVariabel2 = "world";

Dalam menamakan variabel, kalian pun perlu mengikuti beberapa ketentuan sebagai berikut:

1. Menggunakan konvensicamelCase, yaitu menggunakan huruf kecil pada permulaan kata, dan jika nama variabel terdiri dari 2 kata atau lebih, maka kata kedua dan berikutnya diawali dengan huruf besar. (Ini sebenarnya bukan syarat mutlak; hanya kebiasaan. Nanti kalian akan menemukan konvensi lain seperi PascalCase saat belajar JavaScript lebih lanjut);

2. Nama variabel boleh diawali dengan underscore(_), huruf besar (jika diharuskan), dan $.

3. Nama variabel tidak diawali dengan angka, @, *, #, !, %, (), -, +.

4. Tidak boleh menggunakan kata kunci JavaScript seperti boolean, break, else, extends, dan lain-lain.

5. Antara kata pertama dan kata kedua tidak diberi spasi atau dash(-);

6. Karena JavaScript bersifat case-sensitive, maka penamaan juga case-sensitive (jadi variabel hitung dengan variabel Hitung itu berbeda).

Contoh:

// Contoh penulisan nama variabel yang benar

let nama;
let tempatTinggal;
let _nomorHandphone;
let $nomorAkunBank;

// Contoh penulisan nama variabel yang salah

let makanan pembuka; //tidak boleh ada spasi
let @username; //tidak boleh diawali dengan @
let delete; //delete itu merupakan kata kunci di JavaScript

2.2. Tipe Data JavaScript

Variabel dan Tipe Data JavaScript

Sebuah variabel bisa kita isi dengan suatu data. Caranya adalah dengan menggunakan = setelah nama variabel, lalu diikuti dengan datanya.

Contohnya seperti ini:

let nama = "Stefanus";
const namaIbuKandung = "Clara";
const umur = 20;
const apakahSudahMenikah = false;
let jumlahAnak;

Pada contoh di atas, variabel nama bernilai Stefanus dan tipe datanya adalah string. Tipe data string memiliki ciri khas yaitu nilai data dibungkus dengan tanda ' atau ".

Variabel namaIbuKandung juga memiliki nilai yang bertipe data string Clara. Lalu apa yang membedakan kedua variabel tersebut?

• Variabel yang dideklarasikan menggunakan kata kunci let dapat diubah nilainya. Misalnya kita ingin mengubah variabel nama tadi menjadi Albert, kita cukup memberinya data tersebut seperti ini:

  // memberi nilai baru kepada variabel nama
  nama = "Albert"; 

• Sementara variabel yang dideklarasikan menggunakan kata kunci const tidak dapat diubah nilainya; sudah konstan. Jika kita tetap mencoba untuk memberinya nilai seperti di bawah ini, akan muncul error.

  // memberi nilai baru kepada variabel namaIbuKandung tadi
  namaIbuKandung = "Juliana";
  
  // akan muncul error
  Uncaught TypeError: Assignment to constant variable.

📝Catatan:

Namun terdapat 2 pengecualian dalam penggunaan kata kunci const. Variabel yang memiliki tipe data array atau objek bisa diubah nilai element atau propertinya meskipun menggunakan kata kunci const saat dideklarasikan. Kalian akan belajar ini di topik selanjutnya.

Kembali ke pembahasan tipe data. Variabel umur memiliki nilai 20 yang mana termasuk tipe data number. Tipe data ini bisa berupa:

• integer (seperti 1, 2, dan 3)
• atau float (seperti 3.14, 2.718, dan 1.618)

Selanjutnya, variabel apakahSudahMenikah bernilai false dengan tipe data boolean.

Tipe boolean ini terdiri dari 2 nilai:

• true yang bernilai benar
• false yang bernilai salah

Terakhir, variabel jumlahAnak bernilai undefined, karena memang tidak diisi dengan nilai apapun. Jika variabel tidak kita beri sebuah nilai, secara default (standar) ia memiliki nilai undefined.

---

Untuk merangkum, berikut adalah 7 tipe data yang ada dalam JavaScript:

• string - deretan karakter yang diapit oleh sepasang tanda kutip;
• number - bilangan bulat, pecahan, dan lain-lain;
• boolean - nilai benar dari sebuah pernyataan yang dituliskan sebagai true atau false;
• null - sebuah nilai yang berarti kosong atau menunjuk pada nilai yang tidak ada;
• undefined - berbeda dari null, undefined menandakan kondisi variabel yang belum diberi sebuah nilai. Jadi pernyataan "nilai variabel itu adalah undefined" sebenarnya kurang tepat, sebab variabelnya memang tidak mempunyai sebuah nilai;
• symbol - sebuah nilai unik yang dihasilkan tiap kali kita memanggil fungsi Symbol(). Nilai unik ini memiliki beberapa kegunaan seperti memberi nomor identifikasi unik dan berperan sebagai nama properti unik sebuah objek;
• object - sebuah kumpulan pasangan properti dan nilai. Seperti objek dalam kehidupan sehari-hari saja. Misalnya objek Apel memiliki properti warna dengan nilai merah.

2.3. Menampilkan Data di Console

Variabel dan Tipe Data JavaScript

Browser pada umumnya mempunyai tab console yang bisa digunakan untuk menampilkan data console.log dari kode JavaScript. Untuk mengaktifkan tab console di Chrome, bisa dilakukan dengan pilih menu View -> Developer -> Developer Tools atau dengan tekan tombol F12 atau kombinasi tombol Ctrl-Shift-I.

Kenalan dulu yuk dengan console.log. Apa itu console.log dan apakah kegunaannya?

console.log adalah salah satu syntax JavaScript untuk menampilkan nilai suatu variabel atau hasil operasi di tab console.

Contoh:

let nama = "Budi";
let umur = 20;
let apakahSudahMenikah = false;
let jumlahAnak;

// Cobalah buka tab console di developer tools browser anda
console.log(nama); // output: Budi
console.log(umur); // output: 20
console.log(apakahSudahMenikah); // output: false
console.log(jumlahAnak); // output: undefined

Untuk apa kita menggunakan console.log?

Dengan console.log, output dari variabel atau operasi yang kita masukkan tidak akan kelihatan di halaman website dan hanya bisa tampil di tab console. Dengan begitu, output tersebut tidak akan mengganggu tampilan website kamu.

console.logjuga sering digunakan developer ketika mau debug/investigasi kesalahan di kode yang ditulis.