Tipe Data di JavaScript: Penjelasan Lengkap dan Contoh Praktis

Tipe Data di JavaScript adalah fondasi penting untuk memahami cara browser maupun Node.js menyimpan, memproses, dan menukar nilai di program kalian.

Halo teman-teman, sebelum menulis baris kode, ada baiknya kita paham dulu jenis-jenis data yang akan sering ditemui. Pada artikel ini kodelyly.com akan membahas tipe data secara ringkas, contoh praktisnya, serta tips agar kode lebih rapi dan minim bug.

Tipe Data Di JavaScript

Secara garis besar, JavaScript memiliki dua kelompok tipe data, yaitu primitive dan reference. Kelompok pertama menyimpan nilai langsung, sedangkan kelompok kedua menyimpan referensi ke lokasi memori. Pemahaman perbedaan ini akan berpengaruh pada cara kalian menyalin, membandingkan, maupun memodifikasi data.

Primitive Type

Tipe primitive meliputi string, number, boolean, null, undefined, symbol, dan bigint. Tipe-tipe ini bersifat immutable, artinya setiap operasi menghasilkan nilai baru. Contoh: menggabungkan string akan menghasilkan string baru, bukan mengubah string lama.

Contoh singkat:

const nama = "Salsa";           // string
const umur = 21;                 // number
const aktif = true;              // boolean
const kosong = null;             // null
let belumDiisi;                  // undefined
const id = Symbol("user");      // symbol
const jumlahBesar = 123n;        // bigint

Reference Type

Tipe reference mencakup object, array, function, dan date. Nilai yang disimpan adalah alamat referensi, sehingga ketika disalin ke variabel lain, keduanya menunjuk ke objek yang sama. Efek sampingnya, perubahan melalui salah satu variabel akan terlihat pada variabel lain.

Contoh singkat:

const user = { nama: "Salsa" };
const duplikat = user;            // menyalin referensi

duplikat.nama = "Kina";
console.log(user.nama);           // "Kina"

Tabel Ringkas Tipe Data

Cara Mengecek Tipe Data

Operator typeof berguna untuk mengenali tipe primitive. Namun ada catatan klasik: typeof null menghasilkan “object” karena alasan historis. Untuk array dan tipe kompleks, gunakan Array.isArray atau Object.prototype.toString.call.

typeof 10;                  // "number"
typeof null;                // "object" (quirk)
Array.isArray([1,2,3]);     // true
Object.prototype.toString.call(new Date()); // "[object Date]"

Konversi Tipe Data

Konversi bisa terjadi implisit maupun eksplisit. Kalian bisa memakai Number(“42”) untuk mengubah string menjadi number, String(123) untuk mengubah number ke string, dan Boolean(nilai) untuk menguji truthiness. Hati-hati dengan operasi seperti “5” – 2 yang menghasilkan 3 karena koersi ke number, sedangkan “5” + 2 menghasilkan “52” karena string concatenation.

Praktik Baik Singkat

Gunakan const untuk nilai yang tidak berubah agar lebih aman. Manfaatkan strict equality (===) demi menghindari koersi tak terduga. Hindari mutasi objek bersama, dan gunakan spread atau structuredClone untuk menyalin data kompleks ketika diperlukan.

FAQ — Tipe Data Di JavaScript

Berikut 6 pertanyaan yang sering muncul seputar tipe data di JavaScript beserta jawaban ringkas dan contoh kodenya.

1) Apa Perbedaan Utama Antara Primitive Dan Reference?

Jawaban:
Primitive (string, number, boolean, null, undefined, symbol, bigint) menyimpan nilai langsung dan bersifat immutable. Reference (object, array, function, date) menyimpan alamat referensi ke nilai di memori. Menyalin primitive membuat salinan nilai; menyalin reference hanya menyalin alamatnya.

let a = "Halo";      // primitive
let b = a;            // salin nilai
b += ", Dunia";
// a tetap "Halo"

const obj1 = { x: 1 }; // reference
const obj2 = obj1;      // salin referensi
obj2.x = 9;
// obj1.x ikut berubah menjadi 9

2) Mengapa typeof Null Menghasilkan "object"?

Jawaban:
Itu adalah quirk historis di JavaScript yang dipertahankan demi kompatibilitas. Untuk cek null, pakai perbandingan langsung value === null.

typeof null;        // "object" (quirk)
const v = null;
v === null;        // true

3) Bagaimana Cara Mengecek Apakah Sebuah Nilai Adalah Array Atau Tanggal?

Jawaban:
Gunakan Array.isArray(value) untuk array, dan Object.prototype.toString.call(value) untuk tipe kompleks seperti Date.

Array.isArray([1,2,3]);                    // true
Object.prototype.toString.call(new Date()); // "[object Date]"

4) Kapan Memakai == Vs ===?

Jawaban:
Selalu utamakan === (strict equality) agar terhindar dari koersi tak terduga. == melakukan koersi tipe otomatis yang sering bikin bug.

"10" == 10;   // true (koersi)
"10" === 10;  // false (tipe beda, hasil yang diharapkan)

5) Apa Itu Koersi (type Coercion) Dan Bagaimana Menghindari Jebakannya?

Jawaban:
Koersi adalah konversi tipe otomatis saat operasi tertentu. Misalnya + bisa jadi penggabungan string jika salah satu operand string. Untuk menghindari kebingungan, gunakan konversi eksplisit.

"5" - 2;           // 3 (koersi jadi number)
"5" + 2;           // "52" (concat string)
Number("42");      // 42 (eksplisit)
String(123);        // "123" (eksplisit)
Boolean("hey");    // true (truthy)

6) Bagaimana Menyalin Object/array Dengan Aman (shallow Vs Deep Copy)?

Jawaban:
Shallow copy menyalin level teratas saja (nested tetap berbagi referensi). Deep copy menyalin seluruh struktur. Pilih sesuai kebutuhan.

const user = { nama: "Rafi", alamat: { kota: "Bandung" } };

// Shallow copy
const c1 = { ...user };
c1.alamat.kota = "Malang"; // user.alamat.kota ikut berubah

// Deep copy sederhana (tanpa fungsi/Date/Map/Set)
const c2 = JSON.parse(JSON.stringify(user));
c2.alamat.kota = "Makassar"; // user tetap "Malang" dari efek di atas

Baca Juga:
Variabel di JavaScript

Kesimpulan

Memahami Tipe Data di JavaScript membantu kalian menulis kode yang konsisten, mudah dirawat, serta bebas dari bug koersi dan referensi. Dengan membedakan primitive dan reference, mengenali cara cek tipe, serta mengelola konversi dengan sadar, kualitas program kalian akan meningkat.

Sekian artikel dari kodelyly.com, semoga bermanfaat dan sampai jumpa di pembahasan berikutnya!