Memahami Konsep Variabel dan Jenis Tipe Data JavaScript

variabel dan jenis tipe data javascript

Pada kesempatan kali ini kita akan belajar memahami konsep variabel dan jenis tipe data JavaScript. Kita akan belajar mengenai konsep dari variabel dan jenis tipe data yang dimiliki pada setiap variabel tersebut.

Memahami Konsep Variable

Ketika menulis sebuah program, kita akan memberikan perintah ke komputer cara memproses informasi seperti mencetak teks ke layar atau melakukan operasi perhitungan. Untuk mempermudah dalam penggunaan dan pemanggilan data, kita dapat menggunakan variabel. Variabel umumnya digunakan untuk menyimpan informasi atau nilai yang akan dikelola dalam sebuah program.

Pada JavaScript setidaknya ada tiga cara untuk mendeklarasikan sebuah variabel, yaitu menggunakan keyword var, let, dan const.

Pada versi ECMAScript 2015 (ES6) diperkenalkan deklarasi variabel dengan let dan const untuk menggantikan var yang dinilai kontroversial dan rawan menimbulkan bug.

Let

Penggunaan variabel dalam JavaScript cukup mudah, ketikkan keyword let yang diikuti dengan nama variabelnya. Kode untuk mendeklarasikan variabel seperti di atas juga dikenal dengan declaration statement.

let lastName;

Selanjutnya, kita dapat mengisi nilai variabel di atas menggunakan tanda sama dengan (=).

let lastName;
lastName = "Dragon Ball";

console.log(lastName);
/* output
Dragon Ball
*/

Atau kita bisa langsung menginisialisasi variabel setelah dideklarasikan. Kode untuk menginisialisasikan nilai ke dalam sebuah variabel dengan tanda sama dengan (=) ini disebut dengan assignment expression. Berikut contohnya :

let lastName = "Dragon Ball";
console.log(lastName);
/* output
Dragon Ball
*/

Nah istilah statement dan expression kembali kita jumpai, karena expression pasti menghasilkan nilai, sehingga mereka bisa muncul di mana pun dalam program JavaScript. Sedangkan, statement merujuk pada aksi, sehingga pada bagian kode tertentu yang membutuhkan nilai, tidak bisa kita isi dengan sebuah statement. Contohnya seperti kode berikut:

let fullName = let lastName; // Error karena let lastName adalah sebuah statement untuk deklarasi variabel. Statement tidak bisa berada di posisi expression.
let fullName = (lastName = "Ball"); // (lastName = "Ball") merupakan expression, sehingga kode ini tidak error.
let fullName = "Dragon" + "Ball"; // "Dragon" + "Ball" juga merupakan expression, sehingga kode ini tidak error.

Dapat kita bisa bayangkan, bahwa variabel sebagai sebuah kotak atau wadah yang menyimpan nilai. Proses inisialisasi atau assignment berarti kita memasukkan nilai ke dalam kotak tersebut.

Variabel lastName di atas akan tersimpan di dalam memori komputer.

Setiap variabel memiliki nama yang dapat kita panggil dan gunakan. Kita dapat menamai variabel dengan nama apa pun, tetapi pastikan penamaannya masih masuk akal dengan konteksnya agar kode mudah dimaintenance.

Berikut beberapa aturan dalam penamaan variabel yang perlu kita ketahui:

  • Hindari penamaan variabel dengan istilah umum seperti “data”.
  • Gunakanlah penamaan variabel yang dapat mendeskripsikan nilai dari variabel itu sendiri.
  • Harus dimulai dengan huruf atau underscore (_).
  • Dapat terdiri dari huruf, angka, dan underscore (_) dengan berbagai kombinasi.
  • Tidak boleh mengandung spasi (whitespace). Jika penamaan variabel lebih dari dua kata, tuliskan secara camelCase. Contoh firstName, lastName, catName, dll.
  • Tidak boleh mengandung karakter spesial (! . , / \ + * = dll.)

Const

Sedangkan untuk Const merupakan kependekan dari constant. Artinya, kita akan mendeklarasikan sebuah variabel dengan const ketika ingin variabel bernilai konstan dan tidak bisa diubah setelah diinisialisasi nilainya. Dapat dibayangkan bahwa variabel bernilai const sebagai sebuah kotak yang ditutup dan disegel setelah diisi, sehingga nilainya tidak bisa diubah lagi.

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

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

Memahami Jenis-jenis Tipe Data

Semua Nilai yang kita inisiallisasi pada variabel pasti memiliki tipe data. Tipe data merupakan pengklasifikasian data berdasarkan jenisnya. Pada JavaScript terdapat beberapa tipe data sebagai berikut:

Undefined

Undefined merupakan tipe data yang terbentuk ketika sebuah variabel tidak memiliki nilai. Artinya, ketika kita mendeklarasikan variabel tanpa menginisialisasikan nilainya, variabel tersebut menjadi undefined.

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

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

Numbers

Number merupakan tipe data yang nilainya merupakan angka. Variabel bertipe data number dituliskan seperti angka pada umumnya.

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 penjumlahan, pengurangan, perkalian, dsb. Berikut operator yang dapat kita gunakan dalam perhitungan aritmatika pada tipe data number:

Operator Fungsi Contoh
+ Penjumlahan 10 + 10 = 20
Pengurangan 15 – 7 = 8
/ Pembagian 21 / 7 = 3
* Perkalian 9 * 9 = 81
% Sisa hasil bagi 5 % 2 = 1
** Perpangkatan 3 ** 3 = 27
let a = 12;
let b = 9;
console.log(a + b)
console.log(a - b)
console.log(a * b)
console.log(a / b)
console.log(a % b)

/* output:
21
3
108
1.3333333333333333
3
*/

Pada operator aritmatika juga terdapat operator increment (++) dan decrement (–), yang 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++), expression akan menghasilkan nilai variabel sebelum ditingkatkan nilainya.
  • Jika dituliskan sebelum variabel (++x), expression akan menghasilkan nilai variabel setelah ditingkatkan nilainya.
/* Increment dan Decrement */

let postfix = 5;
console.log(postfix++);
/* output: 5 */
console.log(postfix);
/* output: 6 */
let prefix = 5;
console.log(++prefix);
/* output: 6 */

BigInt

Pada JavaScript, tipe data Number hanya meliputi nilai dari -(253 – 1) hingga (253 – 1). Untuk kebutuhan umum, nilai tersebut sudah sangat cukup, akan tetapi akan ada kebutuhan tertentu di mana kita membutuhkan cakupan nilai yang lebih besar, seperti untuk kriptografi atau menentukan waktu hingga presisi microsecond.

Kita bisa menggunakan tipe BigInt, sebagai pengganti Number untuk kebutuhan nilai yang lebih besar. Perbedaan tipe BigInt dan Number, penambahan karakter n di akhir angka untuk BigInt. BigInt juga tetap bisa digunakan untuk nilai yang lebih kecil.

const bigNumber = 1234554353535353534901234553453401234567890n;
const myInt = 3421567890123456789012345678901234567890;
const bigIntButSmall = 7n;

console.log(bigNumber);
console.log(myInt);

/* output
1234554353535353534901234553453401234567890n
3.4215678901234568e+39
7n
*/

//Penggunaan Aritmatika BigInt
console.log(5n + 2n);
console.log(5n - 2n);
console.log(5n * 2n);
console.log(5n / 2n);
console.log(5n % 2n);

/* output
7n
3n
10n
2n; Bukan 2.5n
1n
*/

Untuk operasi pembagian, hasilnya akan dibulatkan ke bawah dan tanpa mengandung nilai desimal.

Strings

Tipe data String yang merupakan sebuah teks. Untuk menetapkan nilai sebagai string pada variabel gunakan tanda petik satu (‘) atau petik dua (“) di antara teksnya. Tidak ada perbedaan antara menggunakan petik satu atau petik dua, kita dapat menggunakan tanda petik secara bergantian, khususnya jika kita memiliki teks yang mengandung tanda petik.

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

const question = '"What do you think of JavaScript?" I asked';
console.log(question)
/* output: "What do you think of JavaScript?" I asked */

const answer = '"I think it\'s awesome!" he answered confidently';
/* output: "I think it's awesome!" he answered confidently */

console.log("Windows path: C:\\Program Files\\MyProject");
/* output: Windows path: C:\Program Files\MyProject */

Pada String, kita juga dapat menggunakan operator plus (+). Operator tersebut berfungsi untuk menggabungkan dua teks yang terpisah menjadi satu buah teks.

let greet = "Hello";
let moreGreet = greet + greet;
console.log(moreGreet);

/* output: HelloHello */

Pada JavaScript juga mendukung string interpolation. Sederhananya, kita dapatmemasukkan variabel ke dalam sebuah string template. Untuk mendefinisikan string template, Anda perlu menggunakan backticks (`), biasanya terletak di keyboard di bawah tombol Esc . Di dalam string letakkan variabel yang ingin dimasukkan ke dalam placeholder ${myName}.

const myName = "Bambang";
console.log(`Hello, my name is ${myName}.`);

/* output: Hello, my name is Bambang. */

Boolean

Tipe Data Boolean merupakan kunci utama dalam penentuan logika, karena hanya memiliki dua nilai, yaitu true atau false.

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

/* output: 
boolean
boolean
*/

const a = 10;
const b = 12;
let isGreater = a > b;
let isLess = a < b;
console.log(isGreater);
console.log(isLess);

/* output:
false
true
*/

Null

Tipe null, mirip dengan undefined, akan tetapi null perlu diinisialisasikan pada variabel. Null biasa digunakan sebagai nilai sementara pada variabel, tapi sebenarnya nilai tersebut “tidak ada”.

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

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

/* output:
null
*/

Symbol

Symbol merupakan tipe data baru yang dikenalkan pada ES6, yang digunakan untuk menunjukkan identifier yang unik. Symbol disebut sebagai identifier yang unik karena meskipun kita membuat dua variabel symbol dengan nama atau deskripsi yang sama, kedua nilainya tetap dianggap berbeda.

const id = Symbol("id");
console.log(id);

/* output
Symbol(id)
*/

//meski nama atau deskripsi yang sama, kedua nilainya tetap dianggap berbeda
const id1 = Symbol("id");
const id2 = Symbol("id");
console.log(id1 == id2);

/* output
false
*/

Symbol ini umumnya digunakan sebagai nama property dari Object. Object sendiri merupakan tipe data kompleks untuk menyimpan berbagai struktur data.