Belajar Javascript #4 – Macam macam tipe data pada javascript

Sebelumnya kita telah belajar Cara membuat variabel di Javascript, maka pada kesempatan kali ini kita akan membahas tipe data di javascript. Pada setiap bahasa pemrograman, tipe data merupakan hal wajib untuk pelajari, karena beberapa bahasa pemrograman pastinya mempunyai tipe data. Disini kita akan belajar tipe data dalam javascript.

Mengenal Tipe data di javascript

Tipe data di javascript adalah jenis atau suatu struktur data yang bisa di simpan di dalam variabel. Variabel javascript dapat menampung angka seperti 100 dan value text seperti “Hello World”. value text disebut juga dengan istilah string.

Pada javascript dapat menangani banyak sekali jenis data, Fungsinya untuk bisa membedakan tipe nilai satu dengan yang lainnya. Hal ini dikarenakan javascript adalah bahasa yang bersifat dynamic typing, Jadi kita tidak harus menuliskan tipe data pada saat pembuatan variabel seperti pada bahasa yang bersifat static typing seperti C, Java, dll. Untuk lebih jelas, Perhatikan contoh berikut ini :

var name = "Ratna"; // bertipe data String
var age = 25; // bertipe data integer;
var single = true;  // bertipe data Boolean
   
console.log (typeof name);
console.log (typeof age);
console.log (typeof single);

Tipe data yang kita berikan pada variabel akan dikenali secara otomatis, hal ini bisa juga kita cek dengan kata kunci ”typeof”. Operator typeof erat kaitannya dengan tipe data di JavaScript karena fungsi utama dari operator typeof adalah melakukan pengecekan tipe data dari sebuah nilai. Pada contoh diatas, jika di console maka hasilnya sebagai berikut :

Selain menggunakan typeof, kita juga bisa mengenali tipe data melalui cara penulisannya. Namun kita harus mengetahui jenis-jenis tipe data tersebut, ada banyak jenis tipe data pada javascript, berikut ini saya ulas jenis-jenis tipe data berserta contoh cara penulisannya.

Macam macam Tipe Data Javascript

Berikut ini 10 jenis tipe data dalam pemrograman Javascript :

1. Boolean
2. String
3. Number
4. Bigint
5. Symbol
6. Null
7. Undefined
8. Array
9. NaN
10. Object

Agar lebih mudah memahaminya, sekarang saya akan bahas cara penulisan masing-masing tipe data tersebut.

Tipe data Javascript Boolean

Tipe data boolean mengambarkan entitas logika, boolean hanya memiliki 2 kondisi yaitu true dan false. Perhatikan kode berikut ini :

const foo = true // boolean dengan kondisi true 
const foo2 = false // boolean dengan kondisi false
console.log(foo); 
console.log(foo2); 

Pada contoh diatas, jika di console maka hasilnya sebagai berikut :

Tipe data Javascript String

String merupakan tipe data yang merepresentasikan data yang bersifat textual dan tidak dapat dijumlahkan. Umumnya yang berisi kata atau kalimat dan bisa juga sebuah angka. Di Javascript, data teks disimpan sebagai string. Tidak ada tipe data sendiri untuk satu buah karakter. Namun tidak dapat menjumlahkannya dengan tipe data number.

Penulisan tipe data dari string diawali dan diakhiri dengan tanda kutip (“). Selain itu juga bisa menggunakan tanda kutip tunggal (‘) atau double (“”). Setiap karakter yang terbalut dengan kutip satu (‘) atau kutip dua (“). Penulisan tersebut yang dianggap sebagai string oleh JavaScript.

Kadang anda membutuhkan kombinasi diantara keduanya. Tipe data yang satu ini biasa penggunaannya untuk memuat data. Seperti nama seseorang, nama benda, alamat dan kata atau kalimat.

const alamat = "rumah saya no 123" // menggunakan double quote 
const kota = 'papua' // atau dapat menggunakan single quote 

Tentunya terdapat perbedaan dari penulisan single quote dengan double quote. Dengan penulisan menggunakan singgle quote anda dapat menggunakan backslash (\) untuk menampilkan karakter tertentu. Seperti jika anda ingin menuliskan petik tunggal (singgle quote) pada value string anda.

const name = 'I\'m jono saputra'; // output -> jono saputra'

Tipe data string dapat dilakukan penggabungan terhadap nilai-nilai string lainnya. penggabungan tersebut dapat diimplementasikan dengan menggunakan concatenation operator (+) terhadap string yang ingin digabungkan.

const name = 'I\'m jono saputra ' + ' and i live in papua'; // output -> I'm jono saputra and i live in papua

Tipe data Javascript Number

JavaScript menggunakan format IEEE-754 untuk merepresentasikan dua buah nilai integer dan floating-point (pecahan). Apabila value berupa angka maka javascript akan menggap ini sebagai tipe data number.

 Contoh penulisan tipe data number :

const angka = 100 // number untuk integer 
const angkaPecahan = 20.5 // number juga bisa menjadi float

untuk menampilkan floating-point (angka desimal) anda bisa memasukkan titik desimal diikuti dengan angka dibelakangnya.

Tipe data Javascript Bigint

Tipe data bigint merupakan bilangan decimal yang besar. Bigint adalah integer presisi yang mampu mewakili bilangan bulat uang lebih besar dari 253 -1. Jika hanya mengandalkan tipe data number/integer maka maksimal penggunaannya adalah 9007199254740992. jika jumlahnya melebihi dari 9007199254740992, maka integer tidak support lagi.

Perhatikan kode dibawah ini :

const limit = Number.MAX_SAFE_INTEGER; // output -> 9007199254740991
limit + 1 // output -> 9007199254740992 
limit + 2  // output -> 9007199254740992 <-- mengunci nilai Number.MAX_SAFE_INTEGER + 1

console.log(typeof limit);
console.log(limit + 1);
console.log(limit + 2);

Pada kode diatas, seharusnya Number.MAX_SAFE_INTEGER = 9007199254740991 + 2 = 9007199254740993. Akan tetapi output yang dihasilkan tetap 9007199254740992.  Hal ini disebabkan karena melewati batas maximal Number.MAX_SAFE_INTEGER + 1.

Lihat hasilnya diconsole :

Penjelasan :

perintah ”Number.MAX_SAFE_INTEGER” adalah dengan menampilkan batas maksimal number, sehingga ouput yang dihasilkan 9007199254740991. Sedangkan bila number melebihi batas maksimal 9007199254740992 ini dikarenakan tipe data number mengunci nilai Number.MAX_SAFE_INTEGER + 1, Dan bila batas maksimal di tambah lebih dari 1 (satu), maka komputer akan tetap menampilkan Number.MAX_SAFE_INTEGER + 1 atau 9007199254740992.

Pada contoh permasalahan diatas kita memerlukan fungsi BigInt() untuk menangani permasalahan tersebut. Cara menggunakan bigint dapat melalui fungsi BigInt() atau juga menambahkan (n) pada akhir value.

Perhatikan kode berikut ini :

const bilangBesar = 9007199254740991n; // cara pertama deklarasi tipe data bigint
const bilanganBesarJuga = BigInt(9007199254740991); // cara kedua deklarasi tipedata bigint 
const maksimal = BigInt(Number.MAX_SAFE_INTEGER); // batas maksimal int
const maksimalDikali2 = maksimal * 2n; // batas maksimal di kali 2 

// mengetahui tipe data 
console.log(typeof bilangBesar); // output -> bigint 
//hasil perkalian 2 batas maksimal (9007199254740991n * 2n)
console.log(maksimalDikali2); // output -> 18014398509481982n

hasilnya :

Symbol

Tipe data symbol merupakan tipe data baru setelah kehadiran ES6. Symbol merupakan tipe data primitive yang bersifat immutable (tidak dapat berubah). Tipe data simbol digunakan sebagai pengenal properti objeknya. Setiap tipe data symbol akan mengembalikan dengan nilai Symbol() karena penggunaan tipe data ini menggunakan fungsi Symbol().

Syntak Symbol

Symbol([deskripsi])

Keterangan: Deskripsi besifat optional, deskripsi digunakan pada saat debugging, karena kita tidak dapat mengakses nilai pada symbol.

Symbol memiliki ciri yaitu tidak dapat di konversi dalam sebagai string. Meskipun hampir semua tipe data mendukung secara implisit untuk di konversi sebagai string dengan bantuan fungsi alert() akan tetapi Symbol tidak dapat melakukannya.

const symbol1 = Symbol("sym");
alert(symbol1); // output -> TypeError: Cannot convert a Symbol value to a string

Jika tetap ingin menampilkan symbol sebagai string maka kita harus menggunakan fungsi toString() atau kita juga dapat menggunakan symbol.description untuk mendapatkan deskripsi dari symbol.

const symbol1 = Symbol("sym");
alert(symbol1.toString()); // output -> Symbol("sym")
alert(symbol1.description); // output -> sym

Contoh :

// tipe data symbol akan mengembalikan data symbol()
const symbol1 = Symbol(); // output -> Symbol()

// deklarasi dengan dua nilai symbol() yang sama
const symbol2 = Symbol(23);
const symbol3 = Symbol(23);
console.log(symbol2 === symbol3); // output -> false 

Hasilnya :

Meskipun nilai kedua variable sama, akan tetapi tetap menghasilkan nilai false karena fungsi symbol bersifat unik yang artinya symbol akan tetap menganggap kedua variable tersebut berbeda.

Tipe data Null

Null merupakan tipe data dan juga sebuah nilai. Tipe data ini merepresentasikan nilai kosong/tidak ada nilai sama sekali. Pemberian nilai null dilakukan secara sengaja, yang bertujuan untuk mendefenisikan variable tanpa nilai atau kosong.

var a = null;

Namun jika anda menuliskan string kosong untuk mendefenisikan variable. javascript akan tetap menganggap bahwa variable tersebut bernilai string.

Contoh :

const foo = null;
console.log(foo); // output -> null
// ini merupakan kesalahan saat pengembangan awal javascript
console.log(typeof null); // output -> object

Hasilnya :

Baris kode terakhir menunjukan bahwa null bertipe object. Ini merupakan warisan kesalahan saat awal pengembangan javascript. meskipun saya merasa penggunaan null jarang digunakan saat produksi, namun kita perlu untuk mengetahui tipe data yang satu ini.

Tipe Data Undefined

Undefined merupakan tipe datanya yang spesial hanya memiliki nilai undefined. Jenis tipenya bisa terbentuk pada suatu variabel yang tidak memiliki nilainya. Variable sudah dideklarasi namun tidak ada nilainya di dalam atau tidak diinisialisasi. Mudahnya untuk memahami undefined yaitu variable yang belum didefenisikan atau tidak diberi nilai.

Perhatikan kode berikut ini.

var a;
var b = 'ada nilai';
console.log(a); // undefined
console.log(b); // ada nilai

Hasilnya :

Undefined biasanya ada akibat kelalaian atau kesalahan dari programmer dalam menulis kode. penulisan undefined juga bisa dilakukan secara eksplisit seperti. Sebaiknya anda tidak melakukan hal ini dalam menulis kode program, karena menurut saya memang tidak ada gunanya.

Array

Array adalah tipe data yang unik, array dapat menampung berbagai tipe data didalamnya, sehingga sangat efesien pada beberapa kasus agar dapat lebih mudah dikelola. Berikut ini contoh penggunaan tipe data array.

var a = [10, 'ini string'];

Pada contoh diatas array dapat menampung number dan string, anda juga dapat mencoba dengan menggunakan tipe data lainnya.

Tipe data JavaScript array dapat menyimpan banyak datanya di dalam satu variabel. Kemudian, dari beberapa data tersebut diberi nomor yang sesuai urutan penulisan. Untuk memudahkan saat akan memerlukan data tersebut.

NaN

Tipe data JavaScript NaN atau Not a Number digunakan untuk merepresentasikan sebuah kesalahan. Kesalahan dalam penghitungan bisa terjadi karena perbedaan tipe data. Seperti halnya string dengan number. Proses aritmatika yang salah, sebuah string tidak dapat dihitung dengan numbernya. Contoh di bawah ini.

var x = 'a'/1;
console.log(x); // NaN

Hasilnya :

Contoh penggalan kode di atas adalah proses aritmatika yang salah, sebuah string tidak dapat di hitung dengan number.

Tipe Data Object

Tipe data objek biasanya memiliki kumpulan properti. Dalam properti tersebut didefinisikan dengan pasangan antara Key dan Value atau Nilai. Pada JavaScript, apabila suatu tipe dari data bukanlah primitif, maka bisa dipastikan tipe tersebut adalah Object.

Pada JavaScript Array juga merupakan suatu Object. Tipe data object adalah tipe data yang bersifat mutable, artinya data ini dapat dimanupulasi berdasarkan method yang disediakan oleh tipe data ini. Contoh deklarasi object kosong.

const a = {};

Tipe data object biasa digunakan untuk mengirim data dan menampilkannya ke browser sebagai sebuah data yang utuh. Contohnya.

const a = {
    namaWeb: 'praktekotodidak.com',
    judul: 'Tipe Data object pada JavaScript'};
console.log(a);

Hasilnya :

Penggunaan tipe data object biasanya digunakan pada kirim dan terima melalui API backend.

Begitulah pembahasan 10 jenis tipe data dalam pemrograman Javascript. Berdasarkan pembahasan tersebut, maka kesimpulannya adalah :

1. Boolean, digunakan untuk true/false
2. String, tipe data textual dan tidak dapat dijumlahkan,
3. Number, untuk nomor dengan bentuk apapun: integer ataupun nilai yang memiliki nilai desimal.
4. Bigint, untuk nomor integer yang sangat panjang.
5. Symbol, untuk identifier atau pengenal yang unik.
6. Null, untuk nilai yang tidak diketahui
7. Undefined, untuk nilai yang tidak ada atau tidak diberikan nilai
8. Array. dapat menampung berbagai tipe data didalamnya
9. NaN, Kesalahan dalam penghitungan
10. Object, untuk struktur data yang memiliki kumpulan properti

Baca juga artikel selanjutnya yaitu Belajar Javascript #5 Jenis operator pada javascript