Tutorial Belajar JavaScript Part 14: Mengenal Method Objek Angka (Number) dalam JavaScript

Seperti yang telah kita pelajari di dalam tutorial Pengertian dan Cara Pembuatan Variabel dalam JavaScript, bahwa di dalam JavaScript, sebuah tipe data akan memiliki method (fungsi yang 'melekat') untuk melakukan beberapa operasi. Di dalam tutorial kali ini kita akan mempelajari tentang Method apa saja yang tersedia untuk Objek Angka (Number) dalam JavaScipt.


Pengertian Objek Angka (Number) dalam JavaScipt

Dengan memberikan nilai angka ke dalam sebuah variabel, secara otomatis variabel tersebut akan bertipe angka (number). Variabel dengan tipe angka, akan memiliki method yang bisa digunakan untuk memproses data yang ada didalam varibel tersebut.

Di dalam JavaScript, method untuk tipe angka akan lebih banyak berfungsi untuk mengontrol bagaimana angka tersebut ditampilkan ke dalam web browser, dan umumnya akan menghasilkan nilai dengan tipe data String. Kita akan membahas method untuk tipe data number ini secara satu-persatu.

Method ini diurutkan menurut abjad.


Method JavaScript: Number.toExponential()

Method toExponential digunakan untuk menampilkan angka menjadi tampilan scientific notation. Scientific Notation adalah tampilan angka dengan 1 digit sebelum tanda desimal, dan diikuti dengan tanda pangkat. Misalnya angka 123.45, jika ditulis kedalam bentuk scientific notation akan menjadi 1.23 x 10^2. Akan tetapi, bahasa pemograman umumnya mengganti penyebutan pangkat sepuluh ini menjadi karakter e atau E. Sehingga 1.23 x 10^2 ditulis menjadi 1.23e+2.

Method Number.toExponential menyediakan 1 argumen opsional yang jika diinput inputan akan menentukan 'panjang' digit secara keseluruhan. Argumen ini bisa diisi dengan angka 0 – 20. Apabila tidak menggunakan argumen, maka method toExponential akan menggunakan panjang paling maksimal sesuai jumlah digit dalam variabel asal.

Tipe data kembalian method Number.toExponential() bertipe String.

Berikut adalah contoh penggunaan method toExponential:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Belajar JavaScript</title>
 
<script>
   a = 5000.123456789;
   b = a.toExponential();    
   c = a.toExponential(1);  
   console.log(b);                      // hasil: 5.000123456789e+3
   console.log(c);                      // hasil: 5.0e+3
   console.log(a.toExponential(5));     // hasil: 5.00012e+3
   console.log(a.toExponential(10));    // hasil: 5.0001234568e+3
   console.log(a.toExponential(20));    // hasil: 5.00012345678899964696e+3
</script>
 
</head>
<body>
<h1>Belajar JavaScript</h1>
<p> Saya sedang belajar method toExponential di duniailkom.com </p>
</div>
</body>
</html>

Contoh Penggunaan Fungsi atau Method toExponential dalam JavaScript


Method JavaScript: Number.toFixed()

Method toFixed digunakan untuk membuat tampilan angka dengan jumlah desimal yang tetap. Method ini membutuhkan satu parameter opsional yang jika diinput akan menentukan jumlah digit setelah tanda desimal.

Jika angka yang di tampilkan mengurangi digit asal, method ini akan membulatkan ke bilangan terdekat (0,5 akan menjadi 1). Dan apabila angka yang ditampilkan melebihi digit asal, method ini akan menambahkan angka 0 dibelakang hasil agar tampilan sesuai dengan yang diinginkan.

Misalkan angka 123,222222, akan ditampilkan menjadi 123,22 jika menggunakan method toFixed(2), dan akan ditampilkan menjadi 123,222 jika menggunakan toFixed(3). Hasil pemanggilan method ini bertipe String.

Berikut adalah contoh penggunaan method toFixed untuk tipe data angka dalam JavaScript:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Belajar JavaScript</title>
 
<script>
   a = 123.4367;
   b = a.toFixed();    
   c = a.toFixed(2);  
   console.log(b);               // hasil: 123;
   console.log(c);               // hasil: 123.44;
   console.log(a.toFixed(1));    // hasil: 123.4;
   console.log(a.toFixed(4));    // hasil: 123.4367;
   console.log(a.toFixed(7));    // hasil: 123.4567000;
</script>
 
</head>
<body>
<h1>Belajar JavaScript</h1>
<p> Saya sedang belajar method toFixed di duniailkom.com </p>
</div>
</body>
</html>

Contoh Penggunaan Fungsi atau Method toFixed dalam JavaScriptSeperti hasil dari contoh, method toFixed akan membulatkan angka desimal jika ke bilangan terdekat, dan menambahkan angka 0 pada akhir angka untuk mencukupi bilangan fixed yang diminta. Fitur ini akan sangat berguna untuk merapikan tampilan, misalnya untuk tampilan nominal mata uang yang biasanya memiliki 2 tempat desimal.


Method JavaScript: Number. toPrecision()

Method toPrecision digunakan untuk menampilkan angka dengan jumlah digit angka yang 'tetap' tergantung nilai angka yang dijadikan sebagai argumen. Misalkan jika angka yang akan ditampilkan adalah 12.2234 maka hasil dari toPrecision(2) adalah 12, dan toPrecision(3) adalah 12.2.

Berbeda dengan 2 method sebelumnya, nilai tetap untuk method toPrecision adalah jumlah digit sebelum dan sesudah desimal.

Jika argumen tidak ditulis, method ini akan mengembalikan nilai awal variabel, tanpa 'menformatnya'. Hasil kembalian toPrecision() bertipe String.

Sebagai contoh program, berikut adalah hasil tampilan penggunaan method toPrecision di dalam JavaScript:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Belajar JavaScript</title>
 
<script>
   a = 123.43678;
   b = a.toPrecision();    
   c = a.toPrecision(1);  
   console.log(b);                    // hasil: 123.4367
   console.log(c);                    // hasil: 1e+2
   console.log(a.toPrecision(2));     // hasil: 1.2e+2
   console.log(a.toPrecision(4));     // hasil: 123.4;
   console.log(a.toPrecision(7));     // hasil: 123.4368;
</script>
</head>
<body>
<h1>Belajar JavaScript</h1>
<p> Saya sedang belajar method toPrecision di duniailkom.com </p>
</div>
</body>
</html>

Contoh Penggunaan Fungsi atau Method toPrecision dalam JavaScriptPerhatikan bahwa jika angka asal memiliki digit yang lebih dari argumen method to precision, seperti contoh pemanggilan a.toPrecision(2) dari123.43678 , hasilnya akan ditampilkan menggunakan scientific notation.


Method JavaScript: Number.toString()

Method toString dimiliki hampir semua tipe data. Method ini berfungsi untuk menkonversi tipe data menjadi string.

Jika digunakan untuk tipe data number, method ini bisa diberikan sebuah argumen opsional yang akan menampilkan angka ke dalam bentuk basis lain selain 10. Misalkan angka asal 255, jika dipanggil dengan toString(2) akan ditampilkan menjadi 11111111. Karena toString(2) berarti menampilkan angka menjadi basis 2 (bilangan biner). Argumen yang didukung adalah dari 2 sampai 36.

Berikut adalah contoh tampilan penggunaan method toSting untuk tipe data Number di dalam JavaScript.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Belajar JavaScript</title>
 
<script>
   a = 255;
   b = a.toString();    
   c = a.toString(16);  
   console.log(b);                 // hasil: 255
   console.log(c);                 // hasil: ff
   console.log(a.toString(2));     // hasil: 11111111
   console.log(a.toString(8));     // hasil: 377
   console.log(a.toString(32));    // hasil: 7v
</script>
 
</head>
<body>
<h1>Belajar JavaScript</h1>
<p> Saya sedang belajar method toSting di duniailkom.com </p>
</div>
</body>
</html>

Contoh Penggunaan Fungsi atau Method toString dalam JavaScript

Diluar dari ke empat method yang dijelaskan di sini, JavaScript juga memiliki 2 method lain untuk tipe data number, yakni Number.toLocaleString() untuk menampilkan angka sesuai aturan lokal web browser (mengganti tanda titik menjadi koma untuk pembeda tempat desimal), dan Number.valueOf() yang digunakan untuk memanggil tipe data 'primitif' dari objek angka. Keduanya tidak terlalu sering digunakan.

Selain memiliki method (fungsi) tipe data number di dalam JavaScript juga memiliki read-only properti, atau konstanta yang menyimpan angka 'khusus' yang bisa digunakan di dalam kode program. Konstanta ini akan kita pelajari dalam tutorial berikutnya: Mengenal Konstanta Objek Angka (Number) dalam JavaScript.


eBook JavaScript Uncover Duniailkom
JavaScript sudah menjadi fitur wajib di setiap website modern. Duniailkom telah menyusun eBook JavaScript Uncover yang membahas JavaScript dengan lebih detail dan lebih lengkap, mulai dari dasar hingga konsep DOM, Event dan AJAX. Penjelasan lebih lanjut bisa ke eBook JavaScript Uncover Duniailkom.

9 Comments

  1. Anonymous
    20 Nov 15
    • Andre
      20 Nov 15
  2. Arif
    24 Jan 16
  3. sunsun
    31 Jan 16
    • Andre
      02 Feb 16
  4. Diana
    10 Aug 18
    • Andre
      10 Aug 18
  5. Astu
    29 Nov 22
    • Andre
      29 Nov 22

Add Comment