Number merupakan salah satu tipe data JavaScript yang perlu kita pahami secara mendalam, tipe data ini akan sering kita gunakan saat membuat aplikasi.
Misalnya, jika membuat aplikasi toko online, harga produk tentu perlu kita simpan atau perlakukan sebagai angka.
Tapi, tipe data angka di JavaScript memiliki perilaku dan beberapa keterbatas, ini semua perlu diketahui agar kita bisa menghindari perilaku tak terduga.
Jangan khawatir, Anda tidak perlu menjadi ahli matematika.
Berikut topik yang akan kita bahas seputar tipe data angka:
Apa Itu Number?
Number adalah tipe data primitif yang merepresentasikan data numerik atau angka entah itu positif maupun negatif.
Tipe data angka di JavaScript adalah format biner 64-bit double-precision, mengikuti standar internasional IEEE 754, sama seperti const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 8 di Java atau C#.
Itu artinya angka di JavaScript dapat mewakili nilai pecahan dan selalu disimpan sebagai floating point double-precission, namun dengan beberapa batasan.
Tidak seperti bahasa pemrograman yang lain termasuk Java dan C#, tipe data number di banyak bahasa pemrograman lain biasanya memiliki beberapa jenis, diantaranya integer, short, long, floating-point dan sebagainya.
Tapi di JavaScript, tipe data angka disimpan sebagai floating point tepatnya double.
Ini akan kita bahas di bawah.
Cara Membuat Data Number
Sama seperti string, kita bisa membuat data angka menggunakan sintaks literal, fungsi constructor const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 3, maupun objek const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // number 0.
Angka yang dibuat dengan objek Number (const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 4) akan mengembalikan nilai objek atau non-primitf, sementara yang lainnya menghasilkan nilai primitif.
Tapi, method dan properti yang ada di dalam objek const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // number 0 bisa digunakan pada angka primitif, mirip seperti string.
Oleh karena itu, jangan heran jika kita tiba-tiba bisa mengakses method atau properti tertentu pada angka primitif.
Misalnya, const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // number 3 untuk membulatkan pecahan, contoh const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // number 4. Method tersebut ada di dalam objek const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // number 0.
Anda disarankan membuat angka menggunakan sintaks literal.
Number Literal
Untuk membuat angka menggunakan sintaks literal, kita bisa menulisnya secara langsung, mirip seperti string, tapi tanpa tanda kutip.
Contoh:
const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 3
Angka bisa dibuat menggunakan fungsi const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 3, metode ini menghasilkan nilai yang sama seperti sintaks literal, biasanya digunakan untuk mengkonversi angka di dalam string.
Caranya, cukup masukkan angka atau angka string yang ingin dikonversi ke dalam kurung lengkung.
Contoh:
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // falseIni sama persis seperti angka yang dibuat dengan sintaks literal:
const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: falseKapan menggunakan fungsi const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 3? ketika kita ingin mengkonversi angka di dalam string, contoh:
const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // numberconst a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 4
Jangan gunakan metode ini karena dapat menghasilkan perilaku tak terduga dan memperlambat eksekusi kode.
Membuat data angka menggunakan metode ini menghasilkan nilai non-primitif atau objek.
Contoh:
const a = new Number(1); console.log(a); // Number {1} console.log(typeof a); // object console.log(a instanceof Number); // trueOleh karena itu, membandingkan angka yang dibuat menggunakan sintaks literal atau fungsi const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 3 dengan const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 4 tidak dianggap sama meskipun nilainya sama.
const a = 19; const b = new Number(19); console.log(a === b); // falseNilai Khusus: const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 5, const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 6, dan const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 7
Selain angka (0123456789), di JavaScript, angka memiliki tiga nilai khusus.
Saat membuat aplikasi, ketiga nilai ini sangat jarang atau bahkan tidak pernah diinisialisasi ke variabel secara eksplisit
Tapi ketahuilah, nilai-nilai itu ada di JavaScript.
const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 5 adalah nilai numerik yang mewakili nilai positif tak terhingga, nilai ini biasanya muncul ketika bilangan positif selain 0 dibagi 0.
Contoh:
1 / 0; // Infinity typeof Infinity; // numberSedangkan const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 6 mewakili nilai negatif tak terhingga, nilai ini biasanya muncul ketika bilangan negatif selain 0 dibagi 0.
Contoh:
-1 / 0; // -Infinity typeof -Infinity; // numberBagaimana dengan const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 7 (Not-A-Number)?
const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 7 mewakili nilai yang tidak dapat direpresentasikan, misalnya mengalikan angka dengan string atau melakukan operasi matematika dengan nilai const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 7 itu sendiri.
Contoh:
Kalau dipikir-pikir tidak masuk akal melakukan operasi matematika ke data teks, oleh karena itu JavaScript mengembalikan nilai yang tidak dapat direpresentasikan (const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 7).
Batas Aman Bilangan Bulat
Seperti yang sudah kita bahas sebelumnya, tipe data angka di JavaScript sebetulnya disimpan sebagai floating point double-precission.
Oleh karena itu memiliki beberapa keterbatasan seperti halnya bahasa pemrograman lain yang memiliki tipe data angka floating point double.
JavaScript hanya mampu mewakiliki bilangan bulat dengan aman antara const a = 19; const b = new Number(19); console.log(a === b); // false 1 hingga const a = 19; const b = new Number(19); console.log(a === b); // false 2.
- Minimum: const a = 19; const b = new Number(19); console.log(a === b); // false 1 adalah const a = 19; const b = new Number(19); console.log(a === b); // false 4.
- Maksimum: const a = 19; const b = new Number(19); console.log(a === b); // false 2 adalah const a = 19; const b = new Number(19); console.log(a === b); // false 6.
Aman di sini mengacu pada kemampuan JavaScript mewakiliki bilangan bulat dengan tepat dan akurat.
Di luar rentang tersebut, JavaScript dapat menafsirkan bilangan bulat secara salah.
Untuk mengetahui batas aman minimum dan maksimum, kita bisa menggunakan properti statis const a = 19; const b = new Number(19); console.log(a === b); // false 7 dan const a = 19; const b = new Number(19); console.log(a === b); // false 8 dari objek const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // number 0:
Number.MIN_SAFE_INTEGER; // -9007199254740991 === -(2 ** 53 - 1) Number.MAX_SAFE_INTEGER; // 9007199254740991 === 2 ** 53 - 1Setelah mengetahui batasnya, mari kita buktikan:
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 0Perhatikan kode di atas, kita melakukan operasi matematika yang menghasilkan nilai melebihi batas aman nilai maksimum.
Oleh karena itu, terkadang menghasilkan nilai benar terkadang salah.
Perilaku ini juga berlaku jika kita melakukan operasi matematika yang menghasilkan nilai lebih kecil dari batas aman nilai minimum.
Jangankan nilai hasil operasi matematika, ditulis langsung saja mengembalikan nilai yang salah:
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 1Jika Anda memerlukan angka diluar rentang 1 / 0; // Infinity typeof Infinity; // number 0 dan 1 / 0; // Infinity typeof Infinity; // number 1, gunakan 1 / 0; // Infinity typeof Infinity; // number 2 sebagai alternatinya.
Nilai Numerik yang Dapat Direpresentasikan
JavaScript juga memiliki batas nilai maksimum yang dapat direpresentasikan, kita bisa memeriksanya menggunkaan properti statis 1 / 0; // Infinity typeof Infinity; // number 3 pada objek const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // number 0.
Nilai yang lebih besar dari 1 / 0; // Infinity typeof Infinity; // number 3 direpresentasikan sebagai const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 5.
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 2Sedangkan angka positif terkecil yang dapat direpresentasikan, bisa dicek menggunkaan properti statis 1 / 0; // Infinity typeof Infinity; // number 7 pada objek const a = '19'; const b = Number(a); console.log(typeof a); // string console.log(typeof b); // number 0.
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 31 / 0; // Infinity typeof Infinity; // number 9 adalah angka positif terkecil (bukan angka paling negatif) yang dapat direpresentasikan dalam float presisi, dengan kata lain angka yang paling mendekati 0.
Operasi Matematika Bilangan Pecahan Tidak Selalu Akurat
Saat melakukan operasi matematika pada bilangan pecahan, JavaScript tidak selalu mengembalikan nilai yang akurat.
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 4Untuk mengatasi masalah ini biasanya kedua operan dikalikan dengan 10 kemudian dijumlahkan, hasilnya dibagi 10.
Akurasi dan jumlah maksimum pecahan (angka setelah titik) yang dikembalikan sekitar 17, lebih dari itu tidak dikembalikan.
Perilaku Penjumlahan Angka dengan String
Seperti yang telah kita pelajari, operator -1 / 0; // -Infinity typeof -Infinity; // number 0 dapat digunakan untuk menjumlahkan angka dan menggabungkan string.
Menjumlahkan angka dengan angka hasilnya akan menjadi angka, ini dianggap sebagai penjumlahan:
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 6Menjumlahkan string dengan string hasilnya akan menjadi string, ini dianggap sebagai penggabungan string:
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 7Menjumlahkan angka dengan angka di dalam string hasilnya menjadi string, ini dianggap sebagai penggabungan string, begitu pula sebaliknya (angka di dalam string dengan angka):
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 8Bagaimana dengan ini:
const b = Number(19); console.log(b); // 19 console.log(typeof b); // number console.log(b instanceof Number); // false 9Nilai yang dikembalikan adalah string -1 / 0; // -Infinity typeof -Infinity; // number 1 bukan -1 / 0; // -Infinity typeof -Infinity; // number 2. Ini karena interpreter JavaScript bekerja dari kiri ke kanan.
Pertama, -1 / 0; // -Infinity typeof -Infinity; // number 3 (string dengan angka) hasilnya string -1 / 0; // -Infinity typeof -Infinity; // number 4 ini dianggap penggabungan string.
Kemudian -1 / 0; // -Infinity typeof -Infinity; // number 5 (string dengan angka), sama dengan sebelumnya dianggap penggabungan string.
Oleh karena itu hasilnya string -1 / 0; // -Infinity typeof -Infinity; // number 1.
Tapi, bagaimana dengan yang ini:
const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 0Hasilnya string -1 / 0; // -Infinity typeof -Infinity; // number 7 bukan string -1 / 0; // -Infinity typeof -Infinity; // number 8. Sekali lagi, ini karena interpreter bekerja dari kiri ke kanan.
Pertama, -1 / 0; // -Infinity typeof -Infinity; // number 9 penjumlahan angka, hasilnya angka 'hello' * 1; // NaN NaN / 2; // NaN typeof NaN; // number 0. Kemudian, 'hello' * 1; // NaN NaN / 2; // NaN typeof NaN; // number 1 angka ditambah string dianggap penggabungan string, maka hasilnya string -1 / 0; // -Infinity typeof -Infinity; // number 7.
Jadi, selama angka dijumlahkan dengan string, JavaScript akan menafsirkan panggabungan string sehingga mengembalikan nilai string.
Perilaku ini hanya berlaku untuk operator -1 / 0; // -Infinity typeof -Infinity; // number 0.
Perilaku Operasi Matematika, Angka dengan Angka di Dalam String
Berbeda dengan operator aritmatika penjumlahan (-1 / 0; // -Infinity typeof -Infinity; // number 0).
Jika kita melakukan operasi matematika menggunakan operator perkalian, pengurangan, pembagian, modulus, atau eksponensial (pangkat), angka di dalam string akan dianggap sebagai angka.
const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 1Perilaku ini hanya terjadi jika salah satu operan adalah angka di dalam string. Jika berupa karakter, mengembalikan nilai const a = 19; const b = Number(19); console.log(a === b); // true :: 19 console.log(typeof a === typeof b); // true :: number console.log(a instanceof Number === b instanceof Number); // true :: false 7.