Kodealgo

Tipe Data Primitif dan Non-primitif JavaScript

Ada banyak tipe data yang bisa kita gunakan di JavaScript, namun jika dibandingkan dengan bahasa pemrograman lain sebetulnya lebih sedikit.

Kali ini kita akan mempelajari tipe data primitif seperti string, number, BigInt, Boolean, undefined, null, dan Symbol, serta tipe data non-primitif seperti objek dan array.

Tapi sebelum itu, mari kita pahami terlebih dahulu apa itu tipe data primitif dan non-primitif di JavaScript.

  1. Apa Itu Tipe Data?
    1. Primitif
    2. Non-primitif
  2. Perbedaan Tipe Data Primitif dan Non-primitif
  3. Tipe Data Primitif
    1. String
    2. Number
    3. BigInt
    4. Boolean
    5. undefined
    6. null
    7. Symbol
  4. Tipe Data Non-primitif
    1. Object
    2. Array

Apa Itu Tipe Data?

Tipe data adalah jenis data yang dapat disimpan, dimanipulasi, dan digunakan untuk memberi tahu komputer bagaimana menfasirkan nilai atau datanya.

Tipe data menentukan jenis data yang dimiliki variabel dan tipe operasi, seperti operasi matematika, logika dan sebagainya.

Kita tentunya tidak bisa menggunakan operasi matematika untuk mengalikan string, misalnya 'jeruk' * 'jeruk'.

Tipe data di JavaScript dikelompokkan ke dalam dua kategori primitif dan non-primitif.

Primitif

Tipe data primitif hanya dapat menyimpan satu nilai pada satu waktu dan tidak dapat diubah menggunakan cara yang sama seperti tipe data non-primitif. Tipe data Primitif akan dianggap sama jika nilainya sama.

Non-primitif

Tipe data non-primitif dapat menyimpan lebih dari satu nilai pada satu waktu dan dapat diubah. Tipe data non-primitif akan dianggap berbeda meskipun nilainya sama dan dalam urutan yang sama.

Perbedaan Tipe Data Primitif dan Non-primitif

Jumlah nilai yang dapat disimpan

Primitif, satu nilai:

const nama = 'reza';

Non-primitif, lebih dari satu nilai:

const data = ['reza', 23, true, null, undefined];

Perubahan Nilai

Primitif, tidak dapat diubah:

const nama = 'reza';
console.log(nama[0]); // r

nama[0] = 'R';
console.log(nama); // reza

Non-primitif, dapat diubah:

const mahasiswa = ['renova', 'muhamad', 'reza'];
mahasiswa[0] = 'ucup';

console.log(mahasiswa); // ["ucup", "muhamad", "reza"]

Perbandingan

Kita bisa menggunakan operator kesetaraan ketat === untuk membandingkan dua buah variabel atau operan, ini akan mengembalikan nilai Boolean (true atau false).

Primitif, dianggap sama jika nilainya sama:

const firstName = 'reza';
const namaDepan = 'reza';

console.log(firstName === namaDepan); // true

Non-primitif, dianggap berbeda meskipun nilai dan urutannya sama, tapi dianggap sama jika merujuk ke objek atau array yang sama.

const mahasiswa1 = ['renova', 'muhamad', 'reza'];
const mahasiswa2 = ['renova', 'muhamad', 'reza'];
console.log(mahasiswa1 === mahasiswa2); // false

const binatang1 = ['kucing', 'kelinci', 'ikan'];
const binatang2 = binatang1;
console.log(binatang1 === binatang2); // true

Tipe Data Primitif

Di JavaScript ada tujuh tipe data primitif yang bisa kita gunakan yakni String, Number, BigInt, Boolean, undefined, null, dan Symbol.

String

Tipe data String digunakan untuk mewakili data tekstual atau karakter.

String dapat dibuat menggunakan petik tunggal atau ganda dan diakhiri dengan petik yang sama, kita bisa memasukkan karakter diantara petik.

const firstName = 'renova'; // petik tunggal
const lastName = 'reza'; // petik ganda

Jika di dalam String terdapat petik tunggal, kita harus menggunakan petik ganda sebagai pembungkus String, begitu pula sebaliknya.

Jika aturan ini tidak diikuti, petik yang kita tulis di dalam String akan dianggap sebagai petik penutup.

Atau kita bisa meng-escape menggunakan backslash.

const hari = "jum'at"; // petik tunggal di dalam petik ganda
const kata = 'dia berkata, "Saya sedang belajar JavaScript"'; // petik ganda di dalam petik tunggal
const janji = "Saya akan ke rumah hari jum\'at"; // escape

Ini akan kita pelajari lebih lanjut di artikel khusus yang membahas tipe data string.

Number

Tipe data Number atau angka di JavaScript mewakili angka positif dan negatif entah itu bulat (integer) maupun desimal (floating-point).

const bulatPositif = 10;
const bulatNegatif = -10;
const desimalPositif = 4.5;
const desimalNegatif = -4.5;

Tipe data number juga memiliki nilai khusus yaitu Infinity, -Infinity, dan NaN.

Nilai tak terhingga (Intinity, dan -Infinity) dihasilkan dari pembagian bilangan selain 0 dibagi dengan 0.

const infinityPostif = 5 / 0; // Infinity
const infinityNegatif = -5 / 0; // -Infinity

Sedangkan NaN atau Not-a-Number adalah hasil dari operasi matematika yang tidak valid, seperti mengalikan angka dengan string dan sebagainya.

const angkaKaliString = 5 * 'hello'; // NaN

Nilai pada tipe data Number memiliki batasan, batas bilangan negatif adalah −9007199254740991 sedangkan positif 9007199254740991.

console.log(Number.MIN_SAFE_INTEGER); // −9007199254740991
console.log(Number.MAX_SAFE_INTEGER); // 9007199254740991

Ketika kita melakukan operasi matematika dengan nilai yang berada di luar rentang tersebut, JavaScript dapat menghasilkan nilai yang salah.

console.log(9007199254740992 + 1); // 9007199254740992 | SALAH | Seharusnya: 9007199254740993
console.log(9007199254740992 + 2); // 9007199254740994 | BENAR
console.log(9007199254740992 + 3); // 9007199254740996 | SALAH | Seharusnya: 9007199254740995
console.log(9007199254740992 + 4); // 9007199254740996 | BENAR
console.log(9007199254740992 + 5); // 9007199254740996 | SALAH | Seharusnya: 9007199254740997
console.log(9007199254740992 + 6); // 9007199254740998 | BENAR

Lihatlah kode operasi matematika diatas, kadang menghasilkan nilai benar, kadang salah.

Jika hasil operasi bernilai genap hasilnya benar, jika ganjil hasilnya salah. Oleh karena itu, tipe data BigInt diperkenalkan.

Ini akan kita pelajari lebih lanjut di artikel khusus yang membahas tipe data number.

BigInt

BigInt adalah tipe data baru yang diperkenalkan pada ES2020.

BigInt digunakan untuk menyimpan bilangan bulat tanpa batasasan seperti Number. Kita bisa melakukan operasi matematika dengan aman tanpa khawatir hasilnya salah.

Untuk membuat nilai dengan tipe data BigInt sama seperti Number, namun kita perlu mengakhiri nilai dengan huruf 'n':

const b = 9007199254740992n;
console.log(b + 1n); // 9007199254740993n

Namun, ini hanya bisa digunakan pada bilangan bulat, tidak bisa digunakan pada bilangan desimal:

const a = 1.5n; // Uncaught SyntaxError: Invalid or unexpected token

Operasi matematika harus menggunakan nilai yang sama-sama BigInt:

const a = 1n + 1; // Uncaught TypeError: Cannot mix BigInt and other types, use explicit conversions

const b = 1n + 1n; // 2n

Boolean

Boolean adalah tipe data yang hanya memiliki dua nilai, true dan false.

Jika Anda membutuhkan tipe data yang hanya bernilai benar atau salah (ya atau tidak), tipe data ini bisa menjadi pilihan yang tepat.

const sudahMakan = true;
const sudahNgopi = false;

undefined

undefined adalah nilai yang diberikan ketika variabel dideklarasikan tanpa inisialisasi atau tidak diberi nilai.

Ini hanya berlaku untuk variabel let dan var, karena kita tidak dapat mendeklarasikan variabel const tanpa nilai.

var nama;
let umur;
console.log(nama); // undefined
console.log(umur); // undefined

null

null dapat digunakan untuk mewakili ketidakhadiran yang disengaja dari nilai objek.

Kita dapat menetapkan null ke variabel untuk menunjukkan bahwa saat ini variabel tersebut tidak memiliki nilai apa pun, tapi nanti akan memilikinya.

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

mahasiswa = {
  nama: 'reza',
  umur: 19,
  jurusan: 'Teknik Informatika',
};
console.log(mahasiswa); // {nama: "reza", umur: 19, jurusan: "Teknik Informatika"}

Symbol

Symbol adalah tipe data baru yang diperkenalkan pada JavaScript ES2015.

Nilai yang memiliki tipe data Symbol disebut sebagai "nilai Symbol".

Nilai Simbol dibuat dengan menjalankan fungsi Symbol yang secara dinamis menghasilkan nilai unik. Nilai sebenarnya bersifat anonim, tidak bisa dilihat.

const a = Symbol();
const b = Symbol();

console.log(a === b); // false
console.log(a); // Symbol()
console.log(b); // Symbol()

Symbol biasanya digunakan sebagai nama kunci saat menambahkan properti baru ke objek agar tidak menimpa properti dengan nama yang sudah ada.

const mahasiswa = {
  nama: 'reza',
  umur: 19,
};

const nama = Symbol();
mahasiswa[nama] = 'renova';

console.log(mahasiswa); // {nama: "reza", umur: 19, Symbol(): "renova"}
console.log(mahasiswa[nama]); // renova

Tipe Data Non-primitif

Ada banyak tipe data non-primitif di JavaScript diantaranya Array, Object, Map, Set, WeakMap, WeakSet, Date dan sebagainya, semuanya adalah Object.

Untuk saat ini kita hanya perlu mengetahui Object dan Array, dan untuk memudahkan pemahaman anggap keduanya berbeda.

Object

object adalah tipe data yang kompleks yang memungkinkan kita menyimpan kumpulan nilai dengan tipe data yang berbeda. Objek berisi properti yang didefinisikan sebagai pasangan kunci dan nilai (key dan value).

Di JavaScript kita bisa membuat objek dengan beberapa cara, bisa menggunakan new Object(), Object.create(), atau menggunakan notasi literal.

Untuk saat ini mari kita gunakan notasi literal, karena lebih mudah dibuat dan lebih sering digunakan.

Untuk membuat objek literal properti kunci dan nilai dari suatu objek diapit atau dibungkus dengan kurung kurawal {}, jika memiliki lebih dari satu properti dipisahkan dengan koma.

Contoh di bawah ini membuat objek bernama obj, nama adalah kunci sedangkan reza adalah nilainya, begitu pula dengan umur.

const obj = {
  nama: 'reza',
  umur: 19,
};

Untuk mengakses nilai tertentu pada objek kita bisa menggunakan nama objek diikuti dengan titik dan kunci yang ingin diakses nilainya.

const obj = {
  nama: 'reza',
  umur: 19,
};

console.log(obj.nama); // reza

Untuk mengubah nilai kunci objek sama seperti mengakses nilai, namun diperlukan operator assigment = diikuti dengan nilai yang ingin dimasukkan.

const obj = {
  nama: 'reza',
  umur: 19,
};
obj.nama = 'ucup';

console.log(obj.nama); // ucup

Kita juga bisa menambahkan kunci dan nilai baru menggunakan cara yang sama seperti mengubah nilai, namun tentunya kita perlu menggunakan nama kunci baru.

const obj = {
  nama: 'reza',
  umur: 19,
};
obj.pekerjaan = 'web developer';

console.log(obj); // {nama: "reza", umur: 19, pekerjaan: "web developer"}

Ini akan kita pelajari lebih lanjut di artikel khusus yang membahas objek.

Array

Array adalah jenis objek yang dapat digunakan untuk menyimpan beberapa nilai, tanpa properti seperti objek.

Array memiliki indeks yang dimulai dari nol dengan kata lain elemen atau nilai pertama di dalam array memiliki indeks 0, elemen berikutnya memiliki indeks 1 dan seterusnya. kita bisa menggunakan indeks untuk memanipulasi nilainya.

Sama seperti objek, array juga dapat dibuat menggunakan new Array() atau array literal [].

Nilai pada array literal harus diapit dengan kurung siku [], jika memiliki lebih dari satu nilai dipisahkan dengan koma. Kita bisa memasukkan tipe data apa pun ke dalam array, termasuk array dan objek.

const arr = [
  'reza',
  19,
  19n,
  true,
  undefined,
  null,
  { nama: 'ucup' },
  [1, 2, 3, 4],
];

Mengakses elemen array:

const arr = ['reza', 19];

console.log(arr[0]); // reza

Mengubah elemen array:

const arr = ['reza', 19];
arr[1] = 20;

console.log(arr); // ["reza", 20]

Ini akan kita pelajari lebih lanjut di artikel khusus yang membahas array.