Belajar Javascript #5: Tipe Data di Javascript

Mengenal tipe data pada sebuah variabel di bahasa pemrograman itu penting.

Terlebih pada javascript, dimana terdapat 7+ jenis tipe data yang wajib kita ketahui.

Ketujuh tipe data tersebut biasanya akan sering kita gunakan saat menulis kode di bahasa pemrograman javascript.

Tapi sebelum kita mempelajari 7+ tipe data tersebut..

Apa sih tipe data itu?

Apa Itu Tipe Data?

Tipe data adalah jenis data yang digunakan oleh nilai pada sebuah variabel, agar nantinya komputer dapat memahami serta menafsirkan tipe data apa yang digunakan.

Dalam pengertian lainnya, tipe data adalah konsep fundamental dalam pemrograman yang menunjukan jenis nilai apa yang dapat dimiliki oleh suatu variabel atau ekspresi.

Tipe data memberikan informasi kepada komputer tentang cara mengoperasikan data yang terkait.

Lalu apa artinya tentang mengoperasikan data yang terkait?

Hal ini merujuk pada berbagai tindakan atau operasi yang dapat dilakukan pada nilai-nilai berdasarkan jenis tipe datanya.

Dalam javascript terdapat 9 tipe data, apa saja itu?

Berikut penjelasan ke sepuluh tipe data di javascript:

Apa Saja Tipe Data di Javascript?

1. String

Tipe data string merupakan jenis tipe data teks.

Artinya tipe data ini, dalam penggunaannya di javascript, digunakan untuk merepresentasikan teks atau rangkaian karakter.

Dengan ciri-ciri menggunakan tanda kutip tunggal ( ’ ) ataupun ganda ( ” ).

Sebagai contoh:

"Hello Word!"

Contoh penggunaan string pada sebuah variabel:

var message = "Hello World!";

2. Number

Dari namanya kita akan tahu bahwa number merupakan jenis tipe data angka.

Atau bisa juga disebut dengan nilai numerik, baik itu bilangan bulat (misal: 4) atau bilangan desimal (misalnya: 4.5).

Contoh penggunaan number pada sebuah variabel:

var age = 23;

3. BigInt

Salah satu tipe data yang mungkin jarang didengar oleh programmer pemula ialah BigInt.

Tipe data BigInt dalam javascript diperkenalkan untuk menangani bilangan bulat dengan presisi yang tinggi, melebihi batas yang dapat diwakili oleh tipe data Number.

Ok, saya paham. Kamu pasti bingung mengenai penjelasan yang diberikan, bukan?

Sederhananya BigInt di javascript ialah tipe data khusus yang digunakan untuk menyimpan angka yang sangat besar, melebihi batas yang dapat ditangani oleh tipe data Number biasa.

Tipe data BigInt akan berguna ketika kita bekerja dengan menggunakan angka yang sangat besar, contohnya dalam kasus perhitungan matematika yang kompleks.

Misalnya jika kita ingin menghitung faktorial dari angka yang sangat besar, maka Tipe data ini (BigInt), akan membantu kita mengatasi batasan yang dimiliki oleh tipe data Number.

Contoh nilai pada variabel yang menggunakan tipe data BigInt:

var totalAset = 1000000000000000000000000000n

Atau kita dapat menggunakan sebuah function dengan nama BigInt() untuk membuat tipe data BigInt, berikut contohnya:

var totalAset = BigInt(1000000000000000000000000000)

4. Undefined

Undefined dalam javascript merupakan jenis tipe data yang digunakan untuk menyatakan bahwa suatu variabel telah dideklarasikan tetapi belum diinisialisasi dengan nilai apapun.

Jika kita artikan dengan lebih sederhana bahwa undefined ini akan muncul jika sebuah variabel tidak di isi oleh sebuah nilai.

Contoh:

var x;
console.log(x); // hasilnya: undefined

kode console.log() pada contoh kode diatas merupakan salah satu cara yang dapat digunakan untuk melihat isi dari sebuah variabel. Lebih lengkapnya silahkan baca: 5 Cara Menampilkan Output di Javascript

5. Null

Tipe data Null dalam javascript, layaknya seperti menyatakan bahwa suatu variabel tidak memiliki nilai atau nilainya kosong.

Jika diibaratkan seperti kotak kosong yang diberi label “null”.

Dalam prakteknya saat kita ingin mengatakan bahwa suatu variabel tidak ada nilainya, maka kita bisa mengatur nilai variabelnya menjadi ’null‘.

Contoh:

var nilaiKosong = null;

Lalu apa kegunaan dari tipe data null?

Tipe data null berguna misalnya saat kita ingin menunjukan bahwa suatu data belum tersedia atau tidak ditemukan.

Jadi ’null’ adalah cara kita memberi tahu program bahwa suatu variabel tidak memiliki nilai untuk saat ini.

6. Boolean

Tipe data boolean merupakan tipe data khusus di javascript yang hanya memiliki dua nilai yang berlaku dalam sebuah variabel yaitu true atau false dengan kata lain benar atau salah.

Contoh kodenya:

var cuacaCerah = true;

Boolean biasanya digunakan pada setiap alur program yang memerlukan pengkondisian atau program yang digunakan untuk mengambil keputusan.

Misalnya, “Jika ini benar, maka lakukan sesuatu; Jika salah, lakukan yang lain”.

Dalam kasus dunia nyata biasanya kita akan menemukan cara kerja dari sistem saklar lampu misalnya, saat menyala itu artinya ’true’, tapi ketika mati maka berarti ’false‘.

7. array

Array merupakan jenis tipe data yang dapat digunakan untuk menyimpan banyak jenis data atau nilai didalamnya.

Jika kita bayangkan konsep tipe data array mirip seperti sebuah kotak besar yang bisa kita gunakan untuk menyimpan banyak jenis barang didalamnya dan setiap barang mempunyai nomor masing-masing.

Itu artinya sama seperti analogi kotak besar tersebut, bahwa array dapat menyimpan banyak jenis nilai didalamnya, dimana setiap nilai memiliki index (urutan nomor) masing-masing.

Ciri dari tipe data array ialah setiap nilai didalamnya berada diantara tanda kurung [ dan kurung ], dan setiap nilai didalamnya dipisahkan dengan tanda ,.

Agar lebih jelas berikut contoh kodenya:

var daftarBuah = ['Apel', 'Jeruk', 'Pisang'];
console.log(daftarBuah); // hasilnya: ['Apel', 'Jeruk', 'Pisang']

Sesuai dengan penjelasan sebelumnya bahwa nilai array memiliki urutan nomor (index) di setiap masing-masing nilainya.

Pada contoh kode diatas, dimana terdapat 3 nilai dalam array yaitu Apel, Jeruk dan Pisang.

Urutan nomor (index) pada nilai array selalu dimulai dari angka 0, dengan begitu artinya:

• Apel memiliki index = 0
• Jeruk memiliki index = 1
• Pisang memiliki index = 2

Lalu apa fungsinya bagi kita untuk mengetahui index dari setiap nilai di array?

Hal ini dapat berguna disaat kita akan menampilkan hanya satu nilai saja dari array.

Sebagai contoh ketika kita mau hanya menampilkan nilai “Apel” saja, dimana Apel memiliki index ke 0.

Maka kita bisa menampilkan nilainya dengan kode seperti berikut:

var daftarBuah = ['Apel', 'Jeruk', 'Pisang'];
console.log(daftarBuah[0]); // hasilnya: Apel
console.log(daftarBuah[1]); // hasilnya: Jeruk
console.log(daftarBuah[2]); // hasilnya: Pisang

Dari contoh kode diatas ketika kita mau menampilkan hanya satu nilai saja, kita dapat menuliskan nilai index yang ingin kita akses kedalam tanda [] disamping variabel daftarBuah.

Hal ini berlaku juga untuk index ke 1 maupun 3.

Oh iya satu hal lagi array juga dapat menyimpan banyak nilai dengan tipe data berbeda didalamnya.

Contoh:

var randomNilai = ['Admin', 23, true];

Selanjutnya, bagaimana dengan jumlah nilai yang dapat disimpan didalam sebuah array?

Apakah ada batasan ketika menyimpan jumlah nilai didalam array?

Pada tipe data array kita tidak memiliki batasan mau berapapun jumlah nilai yang akan kita masukan didalamnya.

Oleh karena itu cukup disesuaikan saja dengan kebutuhan kita mengenai, mau ada berapa jumlah nilai yang akan kita simpan dalam sebuah array.

8. Object

Object merupakan salah satu tipe data yang memiliki keunikan diantara tipe data lainnya.

Meskipun sama seperti array yang dapat menyimpan banyak nilai, akan tetapi tipe data object tidak menyimpan nilainya didalam tanda kurung [] melainkan menggunakan tanda {}.

Di object kita menyimpan banyak nilai dalam bentuk pasangan kunci-nilai (key-value).

Coba lihat contoh kodenya berikut ini:

var mobil = {merk: "Toyota", tahun: 2022, warna: "Hitam"};

Agar lebih mudah dibaca dapat kita ubah kodenya menjadi:

var mobil = {
    merk: "Toyota", 
    tahun: 2022, 
    warna: "Hitam"
};

Lalu dari contoh kode diatas, mana yang dimaksud dengan key (kunci) dan value (nilai)?

• merk, tahun dan warna = key (kunci).
• “Toyota”, 2022, dan “Hitam” = value (nilai).

Untuk menampilkan isi dari setiap nilai di objek kita hanya perlu membuat kode seperti berikut:

var mobil = {
    merk: "Toyota", 
    tahun: 2022, 
    warna: "Hitam"
};

console.log(mobil.merk); // hasilnya: Toyota

// Bisa juga dengan:

console.log(mobil['merk']); // hasilnya: Toyota

jadi ada dua cara yang dapat kita lakukan untuk mengakses nilai di object, yaitu:

1. Menggunakan notasi titik (Dot Notation) untuk mengakses nilai objek berdasarkan nama kuncinya.

Contohnya:

console.log(mobil.merk);

2. Menggunakan kurung siku (Bracket Notation) untuk mengakses nilai objek, khususnya jika nama kunci mengandung spasi atau jika kita ingin menggunakan variabel sebagai kunci.

Contohnya:

console.log(mobil['merk']);

9. Symbol

Symbol dalam javascript merupakan tipe data yang digunakan untuk membuat nilai unik dan tidak dapat diubah.

Itu artinya setiap variabel yang memiliki tipe data symbol, untuk setiap nilainya tentu akan memiliki nilai yang berbeda-beda.

Jenis tipe data ini dapat dikatakan seperti kita memberikan identitas yang unik pada setiap nilai yang diberikan.

Lihat contoh kode berikut:

var simbol = Symbol('deskripsi');

Saat kita mendeklarasikan sebuah variabel dalam contoh kode diatas kita membuat variabel simbol dan kita deklarasikan nilai dengan tipe data symbol yaitu Symbol('deskripsi').

Dari kode diatas maka yang terjadi ialah nilai deskripsi dalam function Symbol() akan menjadi unik. Meskipun nantinya kita mendeklarasikan variabel baru dengan nilai yang sama.

Contohnya:

var simbol1 = Symbol('deskripsi');
var simbol2 = Symbol('deskripsi');

// Coba kita cek apakah kedua nilainya sama
// dengan menggunakan operator pembanding ===

console.log(simbol1 === simbol2); // hasilnya: False

Coba jalankan kode diatas, apakah nilainya false?

Jika false, berarti memang benar bahwa setiap nilai yang dideklarasikan menjadi memiliki type data symbol, maka nilai tersebut bersifat unik dan tak sama.

2 Kategori Tipe Data di Javascript

Sebelumnya kita telah mengetahui apa-apa saja tipe data yang ada di javascript, dari ke 9 tipe data yang telah dijelaskan.

Dari ke sembilan tipe data tersebut jika dikelompokan maka akan membentuk 2 kelompok atau kategori tipe data, yaitu:

• Tipe data Primitif
• Tipe data Non-Primitif

1. Tipe Data Primitif

Tipe data primitif merupakan tipe data dasar yang digunakan untuk menyimpan nilai sederhana.

Apa maksudnya menyimpan nilai sederhana?

Ketika kita menyebut “menyimpan nilai sederhana” pada tipe data primitf, itu berarti bahwa variabel langsung menyimpan nilai sebenarnya.

Misalnya, ketikam kita membuat variabel dengan tipe data primitif seperti number, string, atau boolean.

Variabel tersebut langsung menyimpan nilai tanpa melibatkan referensi ke alamat memori yang lain.

Contoh:

var age = 23; // Variabel age langsung menyimpan nilai 23.
var name = "John"; // Variabel name langsung menyimpan string "John".
var isStudent = true; // Variabel isStudent langsung menyimpan nilai boolean true.

Lalu apa saja tipe data yang tergolong tipe data primitf?

• String
• Number
• BigInt
• Boolean
• Undefined
• Null
• Symbol

2. Tipe Data Non-Primitif (Referensi)

Tipe data Non-Primitif (atau referensi) adalah tipe data yang kompleks, yang dapat menyimpan koleksi nilai atau menyimpan data yang lebih besar.

Dan ya, kategori tipe data non-primitif memang berbeda dengan tipe data primitif yang menyimpan nilai secara langsung.

Pada tipe data non-primitif nilai disimpan dalam bentuk alamat memori yang menunjuk ke lokasi data sebenarnya.

Yang akhirnya nilai tersebut menjadi lebih fleksibel untuk disimpan dan manipulasi struktur datanya bisa menjadi lebih kompleks.

Berikut tipe data yang termasuk dalam golongan tipe data non-primitif:

1. Object

Objek adalah struktur data yang dapat menyimpan banyak pasangan kunci-nilai (key-value), yang bisa membentuk struktur data yang lebih kompleks.

Contoh:

var orang = {
    name: 'Alice', // key name menyimpan nilai string
    age: 30 // key age menyimpan nilai number
}

2. Array

Array adalah struktur data terurut yang menyimpan sejumlah nilai dalam satu variabel.

Contoh:

var numbers = [1, 2, 3, 4, 5, 6];

Perbedaan Antara Primitif dan Non-Primitif

• Primitif VS Non-Primitif:
  • Primitif menyimpan nilai sederhana secara langsung.
  • Non-Primitif menyimpan referensi (nilai) ke lokasi memori yang berisi data sebenarnya.
• Immutable VS Mutable:
  • Primitif bersifat immutable, yaitu nilai tidak dapat diubah.
  • Non-Primitif bersifat mutable, yaitu nilai dan struktur data dapat berubah.

Cara Memeriksa Tipe Data di Javascript

Adakalanya kita mungkin ingin melihat tipe data apa yang dimiliki oleh sebuah nilai yang ada didalam sebuah variabel.

Di javascript kita dapat menggunakan kode fungsi typeof, untuk memeriksa jenis tipe data yang dimiliki oleh nilai pada sebuah variabel.

Dalam penggunaannya, fungsi typeof dapat kita gunakan didalam fungsi console.log(), saat kita ingin melihat jenis tipe data pada variabel melalui console di browser.

Agar lebih jelas berikut contohnya, saat kita memeriksa apakah nilai pada variabel pesan memiliki tipe data string:

var pesan = "Halo Dunia!";

// cek tipe data menggunakan typeof

console.log(typeof pesan); // hasilnya: string

Tidak hanya itu, hal ini juga berlaku untuk tipe data lainnya, jika dalam sebuah variabel kita ingin mengetahui jenis tipe data yang dimiliki oleh sebuah variabel.

Entah itu string, number, bigint, null dan lain-lain.

Konversi Tipe Data di Javascript

Saatnya kita membahas konversi tipe data yang ada dalam bahasa pemrograman javascript.

Di javascript konversi tipe data mengacu pada perubahan nilai dari satu tipe data ke tipe data lainnya.

Pemahaman konsep ini penting karena seringkali dalam pengembangan kode program javascript kita perlu berurusan dengan tipe data yang berbeda.

Di javascript kita akan mengenal 2 cara konversi data, yaitu:

• Implisit Konversi (Implicit Conversion)
• Eksplisit Konversi (Explicit Conversion)

Apa yang dimaksud dengan Implisit dan Eksplisit konversi?

1. Implisit Konversi

Konversi implisit merupakan cara javascript dalam melakukan proses perubahan tipe data menjadi tipe data lainnya secara otomatis.

Itu berarti tanpa adanya campur tangan daripada seorang penulis kode (manusia).

Selain itu kita juga harus ingat bahwa javascript merupakan salah satu bahasa pemrograman yang tergolong dalam Dynamic Typing.

Artinya ialah kemampuan javascript untuk mengubah tipe data dari suatu variabel tanpa perlu mendeklarasikan ulang variabel tersebut.

Contohnya:

var angka = 40;
var teks = "Angkanya adalah: " + angka; // Konversi angka ke string secara otomatis.

2. Eksplisit Konversi

Berbeda dengan implisit konversi.

Pada Konversi Eksplisit, tipe data tidak diubah secara otomatis oleh si javascript.

Melainkan kita sebagai pengembang yang secara sengaja mengubah tipe data menjadi tipe data lainnya dengan menggunakan kode fungsi yang ada di dalam bahasa javascript.

Contoh berikut kita mengubah string “42” menjadi number 42:

var strNumber = "42";
var num = Number(strNumber); // Konversi string ke number secara eksplisit.

Kesimpulan

Mengetahui tentang tipe data itu penting, terlebih pada bahasa pemrograman javascript yang memiliki setidaknya 9 tipe data dimulai dari String, Number, BigInt, Boolean, Undefined, Null dan Symbol yang merupakan jenis tipe data primitif.

Sedangkan Array dan Object termasuk dalam golongan tipe data non-primitif.

Perbedaan kedua kategori tipe data tersebut antara lain Primitif menyimpan nilai sederhana secara langsung dan bersifat immutable. Sedangkan Non-Primitif menyimpan referensi (nilai) ke lokasi memori yang berisi data sebenarnya sekaligus bersifat mutable.

Kemudian dalam mengetahui jenis tipe data kita juga dapat menggunakan typeof, untuk memeriksa tipe data daripada sebuah nilai di javascript.

Lalu saat kita mau mengubah sebuah tipe data yang ada didalam nilai variabel kita dapat menggunakan 2 cara, antara lain: implisit konversi dan eksplisit konversi.

Demikian pembahasan kita kali ini, semoga kamu yang saat ini sedang mempelajari javascript lebih memahami akan bahasa pemrograman yang satu ini.

Selanjutnya Belajar Apa?

Kita telah memahami apa-apa saja tipe data yang dimiliki oleh nilai dalam pemrograman javascript.

Selanjutnya kita akan mengenal tentang statement, dimana hal ini penting agar kita dapat membedakan setiap bagian-bagian dari deklarasi kode javascript.

Pelajari : 📖 Belajar Javascript #6: Memahami Statement di Javascript