Tutorial Javascript 4 - Variabel & Tipe Data dalam JavasScript

Tutorial JavaScript - Ketika mendengar variabel apakah Anda teringat tentang pelajaran matematika? Yups, variabel di sini memiliki konsep yang sama. Variabel umumnya digunakan untuk menyimpan informasi atau nilai yang akan dikelola di dalam sebuah program.

Variabel adalah kode yang merujuk pada sebuah lokasi di memori (RAM) di mana sebuah data berada. Variabel tidak berisi data tetapi hanya merupakan referensi atau rujukan sebuah data di memori. Jadi secara teknis, pernyataan "variabel A bernilai 2" sebenarnya kurang tepat namun pernyataan ini lebih mudah dipahami dan ditulis daripada "variabel A merujuk pada data numerik bernilai 2 di memori".

Ada dua langkah yang diperlukan untuk menggunakan variabel yaitu:

1. Deklarasi
2. Inisialisasi atau definisi

Untuk membuat variabel pada JavaScript kita perlu gunakan keyword var.

var firstName = "Salogy";

Tanda sama dengan = digunakan untuk menginisialisasikan nilai pada variabel, sehingga sekarang variabel firstName memiliki nilai teks “Salogy”.

Kita bisa menggunakan apapun yang kita mau untuk menamai sebuah variabel, tetapi pastikan penamaannya masih masuk akal dan kita bisa menggunakan kombinasi huruf, angka, dan underscore untuk nama variabel tetapi
nama variabel tidak boleh diawali dengan angka. Contoh berikut ini tidak valid:

var 2wheel;

Pada saat variabel dideklarasikan, nilainya adalah undefined sampai kita melakukan inisialisasi. Inisialisasi sebuah variabel berarti memberi nilai awal pada variabel tersebut. Inisialisasi dan deklarasi bisa dilakukan dalam satu baris atau baris yang terpisah.

//Deklarasi & inisialisasi dalam satu baris
var brand = 'Salogy';

//Inisialisasi terpisah
var brand;
brand = 'Salogy';

Kita juga bisa mendeklarasikan beberapa variabel sekaligus hanya dengan satu keyword var di mana antara satu variabel dengan yang lain dipisahkan dengan koma. Seperti contoh berikut:

//semua dalam satu baris
var brand = 'Salogy',type ='clothes', price = 20000;

//baris terpisah (lebih baik daripada satu baris)
var brand = 'Salogy',
type = 'clothes',
price = 20000;

Sebaiknya hindari penamaan variabel dengan istilah umum, gunakanlah penamaan variabel yang dapat mendeskripsikan nilai dari variabel itu sendiri. Berikut beberapa aturan dalam penamaan variabel yang perlu Anda ketahui:

• Dapat dimulai dengan huruf atau underscore (_).
• Dapat terdiri dari huruf, angka, dan underscore (_) dengan berbagai kombinasi.
• Tidak dapat mengandung spasi (white space), jika penamaan variabel lebih dari dua kata maka tuliskan secara camelCase. Contoh firstName, lastName, catName, dll.
• Tidak dapat mengandung karakter spesial (! . , / \ + * =)

Nilai variabel yang diinisialisasi menggunakan var dapat diubah kembali nilainya, contoh:

var firstName = "Salogy";
console.log(firstName);  // Salogy
 
firstName = "Syarian";
console.log(firstName);  // Syarian

Sejak ECMAScript 2015 (ES6) selain var, menginisialisasikan variabel dapat menggunakan let dan const. ES6 melakukan improvisasi pada deklarasi variabel karena menggunakan var terdapat beberapa hal yang kontroversial, salah satunya hoisting. Variabel yang dideklarasikan menggunakan var ini dapat diinisialisasi terlebih dahulu sebelum dideklarasikan, Contoh:

x = 100;
var x;
console.log(x); // 100

Ini dikarenakan proses hoisting, sebenarnya di belakang layar deklarasi variabel x diangkat ke atas sehingga kode yang tampak seperti ini:

var x;
x = 100;
console.log(x);  // 100

Hoisting menjadi kontroversial karena tidak sedikit developer yang dibuat bingung akan hal ini. Masalah ini sudah terselesaikan jika kita menggunakan let dalam mendeklarasikan variabel.

y = 100;
let y;
console.log(y);  // ReferenceError: y is not defined

Membuat Variabel dengan Perintah let

EcmaScript 6 membawa fitur baru kedalam javascript, yakni menggunakan perintah let untuk membuat variabel (sebagai alternatif var). Cara penggunanya sama persis seperti dengan var, berikut contohnya:

let a = "salogy";
let b, c;
b = 9999;
c = true;

console.log(a); // salogy
console.log(b); // 9999
console.log(a); // true

Perbedaan mendasar lainya dari var dan let  selain yang telah saya sebutkan di atas adalah terkait dengan variabel scope, yakni dibagian mana sebuah variabel masih bisa di akses. Dalam artian variabel var dapat di memiliki scope yang lebih luas di bandingkan variabel let.

Konstanta dalam JavaScript

Konstanta dapat dikatakan sebagai variabel yang tidak bisa diubah sepanjang kode program. Setelah konstanta ditulis dan diberi nilai awal, isi konstanta tersebut tidak bisa ditukar dengan nilai lain.

Konstanta sebenernya fitur wajib yang selalu ada di setiap bahasa pemrograman. Namun di javascript sendiri konstanta baru hadir pada ECMAScript 6. Untuk membuat konstanta, kita menggunakan perintah const. Berikut contohnya:

const PI = 3.14;
const SALAM = "Selamat Malam";

console.log(PI);  //3.14
console.log(SALAM);  //Selamat Malam

Disini saya membuat 2 buah konstanta, yakni PI dan SALAM. Keduanya diberikan nilai awal 3.14 dan string "Selamat Malam". Bila berbicara mengenai aturan nama, maka aturan nama dari konstanta sama seperti variabel, karena nama konstanta ini juga termasuk ke dalam indentifier. Kemudian, const digunakan untuk mendeklarasikan sebuah variabel yang sifatnya immutable atau tidak perlu diinisialisasi kembali.

Jika kita menginisialisasi kembali nilai variabel yang menggunakan const, maka akan mendapati eror “TypeError: Assignment to constant variable.”

const z = 100;
console.log(z);  // 100
 
z = 200;
console.log(z);  // TypeError: Assignment to constant variable

Dengan begitu sebaiknya kita gunakan let atau const ketika mendeklarasikan variabel dari pada menggunakan var.

Tipe Data JavaScript

Nilai yang kita tetapkan pada variabel pasti memiliki tipe data. Tipe data merupakan pengklasifikasian data berdasarkan jenis data tersebut. Pada JavaScript terdapat beberapa tipe data sebagai berikut:

Undefined

Tipe data ini terbentuk ketika sebuah variabel tidak memiliki nilai, dalam arti lain ketika kita mendeklarasikan variabel tanpa menginisialisasikan nilainya, maka variabel tersebut menjadi undefined. Contoh:

let x;
console.log(typeof(x));  // output: undefined

Pada contoh kode di atas, kita mendeklarasikan variabel x, tetapi kita tidak menginisialisasikan dengan nilai apapun. Ketika kita memastikan tipe data dengan menggunakan fungsi typeof() maka menghasilkan output undefined.

Fungsi typeof() digunakan untuk memastikan tipe data pada variabel dengan mengembalikan tipe data tersebut dalam bentuk teks.

Numbers

Nilai dari tipe data number adalah angka. JavaScript variabel bertipe data number dituliskan seperti ini:

let x = 10;

Jika angka tersebut merupakan sebuah bilangan desimal, maka kita bisa gunakan tanda titik pada pecahan bilangannya.

let x = 10;
console.log(typeof(x));  // output: number 
 
let y = 17.25;
console.log(typeof(y));  // output: number

Pada tipe data number kita juga dapat melakukan perhitungan aritmatika seperti penambahan, pengurangan, perkalian, dll. Berikut operator yang dapat kita gunakan dalam melakukan perhitungan aritmatika pada tipe data number:

Operator	Fungsi	Contoh
+	Penambahan	10 + 10 = 20
-	Pengurangan	10 - 5 = 5
/	Pembagian	10 / 2 = 5
*	Perkalian	10 * 10 = 100
%	Sisa bagi hasil	5 % 2 = 1

let a = 12;
let b = 9;
 
console.log(a + b);  // 21
console.log(a - b);  // 3
console.log(a * b);  // 108
console.log(a / b);  // 1.33333333
console.log(a % b);  // 3

Pada operator aritmatika juga terdapat operator increment (++) dan decrement (--). Operator increment dan increment digunakan untuk menambahkan atau mengurangi nilai 1 pada nilai variabel yang ada sekarang.

Operator ini dapat dituliskan sebelum atau sesudah variabel, tetapi hal tersebut bukan berarti sama. Berikut ketentuannya:

• Jika dituliskan setelah variabel (x++), statement akan mengembalikan nilai variabel saat ini sebelum ditingkatkan nilainya.
• Jika dituliskan sebelum variabel (++x), statement akan mengembalikan nilai variabel setelah ditingkatkan nilainya.

Lebih jelasnya berikut contoh kode dalam penerapan operator tersebut, perhatikan hasil yang di dapat.

/* Increment dan Decrement */
 
let postfix = 5;
console.log(postfix++);  // 5
 
let prefix = 5;
console.log(++prefix);  // 6

Strings

Tipe data selanjutnya adalah strings, String ini dasarnya adalah sebuah teks. Pada JavaScript untuk menetapkan nilai string pada variabel, gunakan tanda single (‘) atau double quote (“) di antara teksnya. Contohnya:

let greet = "Hello";
console.log(typeof(greet));  // string

Apa pun yang berada di antara tanda double quote atau single quote merupakan sebuah string, baik itu angka, huruf maupun karakter spesial.

Boolean

Boolean hanya dapat memiliki dua nilai, yakni true atau false. Tipe data ini menjadi kunci utama dalam penentuan logika, kita akan memahaminya nanti ketika pembahasan if/else statement. Untuk menetapkan nilai boolean pada variabel kita bisa menggunakan keyword true atau false.

let x = true;
let y = false;
 
console.log(typeof(x));  // boolean
console.log(typeof(y));  // boolean

Null

Yang terakhir adalah null. Serupa dengan undefined, namun null perlu diinisialisasikan pada variabel. null biasa digunakan sebagai nilai sementara pada variabel, tapi sebenarnya nilai tersebut “tidak ada”.

Terkadang kita perlu membuat sebuah variabel, namun kita belum memerlukan nilai apa apa dan tidak ingin terikat oleh tipe data apapun. Nah, daripada kita tidak menetapkan nilai apapun (variabel akan undefined) sebaiknya kita beri nilai null pada variabel tersebut, dan ubah nanti ketika kita membutuhkannya.

Untuk menetapkan null pada variabel, kita dapat gunakan keyword null ketika variabel tersebut diinisialisasikan.

let someLaterData = null;
console.log(someLaterData);  // null

Meskipun terdapat beberapa tipe data dalam JavaScript, tetapi variabel pada JavaScript memiliki sifat tipe data yang dinamis. Artinya, kita dapat memberikan tipe data yang berubah-ubah pada satu variabel yang sama.