Javascript

Method Angka JavaScript: Cara Membuat dan Codenya

Method angka akan membantu dalam penggunaan tipe data angka pada JavaScript.

Method dan Properti Angka

Pada HTML nilai primitif (seperti 3.14 atau 2014), tidak boleh memiliki properti dan method (karena bukan object).

Namun dengan JavaScript, method dan properti juga tersedia untuk nilai primitif, karena JavaScript memperlakukan nilai primitif sebagai object saat menjalankan method dan properti.

Method toString ()

Method toString () mengembalikan angka sebagai string.

Semua method angka dapat digunakan pada semua jenis angka (literal, variabel, atau ekspresi).

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>Method angka JavaScript</h2>

<p> Metode toString () mengonversi angka menjadi string. </p>
<p id="demo"></p>

<script>
var x = 123;
document.getElementById("demo").innerHTML =
  x.toString() + "<br>" +
   (123).toString() + "<br>" +
   (100 + 23).toString();
</script>

</body>
</html>

Method toExponential()

Method toExponential () mengembalikan string dengan angka yang dibulatkan dan ditulis menggunakan notasi eksponensial.

Parameter menentukan jumlah karakter di belakang koma.

Contoh

<!DOCTYPE html>
<html>
<body>

<h2>Method angka JavaScript</h2>

<p> Metode toExponential () mengembalikan sebuah string, dengan angka dibulatkan dan ditulis menggunakan notasi eksponensial. </p>
<p> Parameter menentukan opsional jumlah digit di belakang koma desimal. </p>
<p id="demo"></p>

<script>
var x = 9.656;
document.getElementById("demo").innerHTML =
  x.toExponential() + "<br>" + 
  x.toExponential(2) + "<br>" + 
  x.toExponential(4) + "<br>" + 
  x.toExponential(6);
</script>

</body>
</html>

Parameter dibuat opsional. Jika parameter tidak ditentukan maka JavaScript tidak akan membulatkan angka.

Method toFixed ()

Method toFixed () akan mengembalikan string, dengan angka yang ditulis dengan jumlah desimal tertentu.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>Method angka JavaScript</h2>

<p> Metode toFixed () membulatkan angka menjadi sejumlah digit. </p>
<p> Untuk bekerja dengan uang, toFixed (2) sangat cocok. </p>

<p id="demo"></p>

<script>
var x = 9.656;
document.getElementById("demo").innerHTML =
  x.toFixed(0) + "<br>" +
  x.toFixed(2) + "<br>" +
  x.toFixed(4) + "<br>" +
  x.toFixed(6);
</script>

</body>
</html>

toFixed (2) sangat cocok untuk bekerja dengan uang.

Method toPrecision ()

Method toPrecision () mengembalikan string, dengan angka yang ditulis dengan panjang tertentu.

Contoh

<!DOCTYPE html>
<html>
<body>

<h2>Method angka JavaScript</h2>

<p> Metode toPrecision () mengembalikan sebuah string, dengan angka yang ditulis dengan panjang yang ditentukan: </p>

<p id="demo"></p>

<script>
var x = 9.656;
document.getElementById("demo").innerHTML = 
  x.toPrecision() + "<br>" +
  x.toPrecision(2) + "<br>" +
  x.toPrecision(4) + "<br>" +
  x.toPrecision(6);  
</script>

</body>
</html>

Method valueOf ()

Method valueOf () mengembalikan angka sebagai angka.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>Method angka JavaScript</h2>

<p>Method valueOf () mengembalikan angka sebagai angka.</p>

<p id="demo"></p>

<script>
var x = 123;

document.getElementById("demo").innerHTML = 
  x.valueOf() + "<br>" +
  (123).valueOf() + "<br>" +
  (100 + 23).valueOf();
</script>

</body>
</html>

Dalam JavaScript, angka bisa menjadi nilai primitif (typeof = number) atau object (typeof = object).

Method valueOf () digunakan secara internal dalam JavaScript untuk mengonversi object Angka menjadi nilai primitif.

Method ini tidak akan digunakan dalam kode selain dengan alasan diatas.

Semua tipe data JavaScript memiliki method valueOf () dan toString ().

Mengubah Variabel menjadi Angka

Ada 3 method JavaScript yang dapat digunakan untuk mengubah variabel menjadi angka, yaitu:

  • Method Number ()
  • Method parseInt ()
  • Method parseFloat ()

Method ini bukanlah method angka, tetapi method JavaScript global.

Method JavaScript Global

Method JavaScript Global dapat digunakan pada semua tipe data JavaScript.

Method berikut adalah method yang paling relevan apabila digunakan pada angka.

MethodDeskripsi
Number()Mengembalikan angka yang dikonversi dari argumennya.
parseFloat()Mengurai argumennya dan mengembalikan angka floating point
parseInt()Mengurai argumennya dan mengembalikan ke dalam tipe integer

Method Number()

Method Number() dapat digunakan untuk mengubah variabel JavaScript menjadi angka.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Global Method</h2>

<p> Method Number () mengubah variabel menjadi angka: </p>
<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
  Number(true) + "<br>" +
  Number(false) + "<br>" +
  Number("10") + "<br>" + 
  Number("  10") + "<br>" +
  Number("10  ") + "<br>" +
  Number(" 10  ") + "<br>" +
  Number("10.33") + "<br>" + 
  Number("10,33") + "<br>" +
  Number("10 33") + "<br>" +
  Number("John");
</script>

</body>
</html>

Jika nomor tidak dapat dikonversi, maka akan dikembalikan sebagai NaN (Not a Number).

Method Number() yang Digunakan pada Tanggal

Method Number() juga dapat digunakan untuk mengubah tanggal menjadi angka.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Global Method</h2>

<p> Metode Number () dapat mengubah tanggal menjadi angka: </p>
<p id="demo"></p>

<script>
var x = new Date("2017-09-30");
document.getElementById("demo").innerHTML = Number(x); 
</script>

</body>
</html>

Method Number () di atas mengembalikan angka milidetik sejak 1.1.1970.

Method parseInt()

Method parseInt () digunakan untuk mengurai string dan mengembalikan bilangan bulat. Spasi diperbolehkan dan hanya angka pertama yang dikembalikan.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Global Function</h2>

<p>The global JavaScript function parseInt() converts strings to numbers:</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
  parseInt("10") + "<br>" +
  parseInt("10.33") + "<br>" +
  parseInt("10 6") + "<br>" +  
  parseInt("10 years") + "<br>" +  
  parseInt("years 10");  
</script>

</body>
</html>

Jika nomor tidak dapat dikonversi, NaN (Not a Number) dikembalikan.

Method parseFloat()

Method parseFloat() mengurai string dan mengembalikan angka. Spasi diperbolehkan. Hanya nomor pertama yang dikembalikan:

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Global Method</h2>

<p> Metode parseFloat () mengonversi string menjadi angka: </p>
<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
  parseFloat("10") + "<br>" +
  parseFloat("10.33") + "<br>" +
  parseFloat("10 6") + "<br>" +  
  parseFloat("10 years") + "<br>" +
  parseFloat("years 10");    
</script>

</body>
</html>

Jika nomor tidak dapat dikonversi, NaN (Not a Number) dikembalikan.

Properti Angka

PropertyDescription
MAX_VALUEMengembalikan angka terbesar dalam JavaScript
MIN_VALUEMengembalikan angka terkecil dalam JavaScript
POSITIVE_INFINITYMewakili tak terhingga (dikembalikan saat overflow)
NEGATIVE_INFINITYMewakili infinity negatif (dikembalikan pada overflow)
NaNMerepresentasikan nilai “Not-a-Number”

JavaScript MIN_VALUE and MAX_VALUE

MAX_VALUE mengembalikan kemungkinan bilangan terbesar yang ada dalam JavaScript.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p> MAX_VALUE mengembalikan kemungkinan bilangan terbesar dalam JavaScript. </p>
<p id="demo"></p>

<script>
var x = Number.MAX_VALUE;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

MIN_VALUE mengembalikan angka terendah yang mungkin dalam JavaScript.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>MIN_VALUE mengembalikan angka terendah yang mungkin dalam JavaScript.</p>

<p id="demo"></p>

<script>
var x = Number.MIN_VALUE;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

JavaScript POSITIVE_INFINITY

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>POSITIVE_INFINITY</p>

<p id="demo"></p>

<script>
var x = Number.POSITIVE_INFINITY;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

POSITIVE_INFINITY dikembalikan pada overflow.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>POSITIVE_INFINITY dikembalikan pada overflow.</p>

<p id="demo"></p>

<script>
var x = 1 / 0;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

JavaScript NEGATIVE_INFINITY

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>NEGATIVE_INFINITY</p>

<p id="demo"></p>

<script>
var x = Number.NEGATIVE_INFINITY;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

NEGATIVE_INFINITY dikembalikan saat overflow.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>NEGATIVE_INFINITY</p>

<p id="demo"></p>

<script>
var x = -1 / 0;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

JavaScript NaN – Not a Number

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = Number.NaN;
</script>

</body>
</html>

NaN adalah kata khusus JavaScript yang menunjukkan bahwa bilangan bukan bilangan resmi.

Saat mencoba melakukan perhitungan aritmatika dengan string non-numerik akan menghasilkan NaN (Not a Number).

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p> Angka dibagi dengan string non-numerik menjadi NaN (Bukan Angka): </p>
<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 100 / "Apple";
</script>

</body>
</html>

Properti Angka Tidak Dapat Digunakan pada Variabel

Properti angka adalah properti pembungkus object angka pada JavaScript yang disebut Number.

Properti ini hanya dapat diakses dengan Number.MAX_VALUE.

Menggunakan myNumber.MAX_VALUE, di mana myNumber adalah variabel, ekspresi, atau nilai, akan mengembalikan tidak terdefinisi.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p> Menggunakan properti Angka pada variabel, ekspresi, atau nilai, akan mengembalikan tak terdefinisi: </p>
<p id="demo"></p>

<script>
var x = 6;
document.getElementById("demo").innerHTML = x.MAX_VALUE;
</script>

</body>
</html>


Catur Kurnia Sari

Share
Tags: javascriptnumber