JavaScript-numerot


Sisällysluettelo

    Näytä sisällysluettelo


JavaScriptillä on vain yksi numerotyyppi. Numerot voidaan kirjoittaa desimaalien kanssa tai ilman.


Esimerkki

let x = 3.14;    // A number with decimals
let y = 3;       // A number without decimals

Kokeile Sinä itse "

Erittäin suuria tai erittäin pieniä lukuja voidaan kirjoittaa tieteellisellä (eksponentti) merkinnällä:

Esimerkki

let x = 123e5;    // 12300000
let y = 123e-5;   // 0.00123

Kokeile Sinä itse "


JavaScript-numerot ovat aina 64-bittisiä liukulukuja

Toisin kuin monet muut ohjelmointikielet, JavaScript ei määrittele erityyppisiä lukuja, kuten kokonaislukuja, lyhyitä, pitkiä, liukuluku jne.

JavaScript-luvut tallennetaan aina kaksinkertaisena tarkkuuden liukulukuna numerot kansainvälisen IEEE 754 -standardin mukaisesti.

Tämä muoto tallentaa numerot 64-bittisinä, joissa luku (murto) tallennetaan bitteinä 0 51:een, eksponentti biteissä 52-62 ja etumerkki bitissä 63:

Value (aka Fraction/Mantissa) Exponent Sign
52 bits (0 - 51)  11 bits (52 - 62) 1 bit (63)

Kokonaisluvun tarkkuus

Kokonaisluvut (luvut ilman pistettä tai eksponenttimerkintää) ovat tarkkoja 15 numeroon asti.

Esimerkki

let x = 999999999999999;   // x will be 999999999999999
let y = 9999999999999999;  // y will be 10000000000000000

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Numbers</h1>
<h2>Integer Precision</h2>

<p>Integers (numbers without a period or exponent notation) are accurate up to 15 digits:</p>

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

<script>
let x = 999999999999999;
let y = 9999999999999999;
document.getElementById("demo").innerHTML = x + "<br>" + y;
</script>

</body>
</html>


Desimaalien enimmäismäärä on 17.

Kelluva tarkkuus

Liukulukuaritmetiikka ei aina ole 100 % tarkka:

let x = 0.2 + 0.1;

Kokeile Sinä itse "

Yllä olevan ongelman ratkaisemiseksi se auttaa kertomalla ja jakamalla:

let x = (0.2 * 10 + 0.1 * 10) / 10;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Floating point arithmetic is not always 100% accurate:</p>
<p id="demo1"></p>

<p>But it helps to multiply and divide:</p>

<p id="demo2"></p>

<script>
let x = 0.2 + 0.1;
document.getElementById("demo1").innerHTML = "0.2 + 0.1 = " + x;
let y = (0.2*10 + 0.1*10) / 10;
document.getElementById("demo2").innerHTML = "0.2 + 0.1 = " + y;
</script>

</body>
</html>




Numeroiden ja merkkijonojen lisääminen

VAROITUS !!

JavaScript käyttää +-operaattoria sekä lisäämiseen että ketjuttamiseen.

Numerot lisätään. Merkkijonot ketjutetaan.

Jos lisäät kaksi numeroa, tuloksena on numero:

Esimerkki

let x = 10;
let y = 20;
let z = x + y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>If you add two numbers, the result will be a number:</p>

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

<script>
let x = 10;
let y = 20;
let z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>


Jos lisäät kaksi merkkijonoa, tuloksena on merkkijonojen ketju:

Esimerkki

let x = "10";
let y = "20";
let z = x + y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>If you add two numeric strings, the result will be a concatenated string:</p>

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

<script>
let x = "10";
let y = "20";
let z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>


Jos lisäät numeron ja merkkijonon, tuloksena on merkkijonojen ketju:

Esimerkki

let x = 10;
let y = "20";
let z = x + y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>If you add a number and a numeric string, the result will be a concatenated string:</p>

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

<script>
let x = 10;
let y = "20";
let z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>


Jos lisäät merkkijonon ja luvun, tuloksena on merkkijonojen ketju:

Esimerkki

let x = "10";
let y = 20;
let z = x + y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>If you add a numeric string and a number, the result will be a concatenated string:</p>

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

<script>
let x = "10";
let y = 20;
document.getElementById("demo").innerHTML = "The result is: " + x + y;
</script>

</body>
</html>


Yleinen virhe on odottaa tämän tuloksen olevan 30:

Esimerkki

let x = 10;
let y = 20;
let z = "The result is: " + x + y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>A common mistake is to expect this result to be 30:</p>

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

<script>
var x = 10;
var y = 20;
document.getElementById("demo").innerHTML =
"The result is: " + x + y;
</script>

</body>
</html>


Yleinen virhe on odottaa tämän tuloksen olevan 102030:

Esimerkki

let x = 10;
let y = 20;
let z = "30";
let result = x + y + z;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>A common mistake is to expect this result to be 102030:</p>

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

<script>
let x = 10;
let y = 20;
let z = "30";
let result = x + y + z;
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>


JavaScript-tulkki toimii vasemmalta oikealle.

Ensimmäiset 10 + 20 lisätään, koska x ja y ovat molemmat numeroita.

Sitten 30 + "30" ketjutetaan, koska z on merkkijono.


Numeeriset merkkijonot

JavaScript-merkkijonoissa voi olla numeerista sisältöä:

let x = 100;         // x is a number

let y = "100";       // y is a 
string

JavaScript yrittää muuntaa merkkijonot numeroiksi kaikissa numeerisissa operaatioissa:

Tämä toimii:

let x = "100";
let y = "10";
let z = x / y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>JavaScript will try to convert strings to numbers when dividing:</p>

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

<script>
let x = "100";
let y = "10";
let z = x / y;   
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Tämä toimii myös:

let x = "100";
let y = "10";
let z = x * y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>JavaScript will try to convert strings to numbers when multiplying:</p>

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

<script>
let x = "100";
let y = "10";
let z = x * y;   
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Ja tämä toimii:

let x = "100";
let y = "10";
let z = x - y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>JavaScript will try to convert strings to numbers when subtracting:</p>

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

<script>
let x = "100";
let y = "10";
let z = x - y;   
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Mutta tämä ei toimi:

let x = "100";
let y = "10";
let z = x + y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>JavaScript will NOT convert strings to numbers when adding:</p>

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

<script>
let x = "100";
let y = "10";
let z = x + y;   
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Viimeisessä esimerkissä JavaScript käyttää +-operaattoria merkkijonojen ketjuttamiseen.


NaN - Ei numero

NaN on JavaScript-varattu sana, joka osoittaa, että numero ei ole laillinen numero.

Aritmetiikka ei-numeerisen merkkijonon avulla saa aikaan NaN (ei Määrä):

Esimerkki

let x = 100 / "Apple";

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>A number divided by a non-numeric string becomes NaN (Not a Number):</p>

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

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

</body>
</html>

Jos merkkijono on kuitenkin numeerinen, tulos on a määrä:

Esimerkki

let x = 100 / "10";

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>A number divided by a numeric string becomes a number:</p>

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

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

</body>
</html>

Voit käyttää yleistä JavaScript-funktiota isNaN() selvittääksesi, onko arvo jokin muu kuin luku:

Esimerkki

let x = 100 / "Apple";
isNaN(x);

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>You can use the global JavaScript function isNaN() to find out if a value is not a number:</p>

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

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

</body>
</html>

Varo NaN:ta. Jos käytät NaNa matemaattisessa operaatiossa, tulos on myös NaN:

Esimerkki

let x = NaN;
let y = 5;
let z = x + y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>If you use NaN in a mathematical operation, the result will also be NaN:</p>

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

<script>
let x = NaN;
let y = 5;
document.getElementById("demo").innerHTML = x + y;
</script>

</body>
</html>

Tai tulos voi olla ketjutus, kuten NaN5:

Esimerkki

let x = NaN;
let y = "5";
let z = x + y;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>If you use NaN in a mathematical operation, the result can be a concatenation:</p>

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

<script>
let x = NaN;
let y = "5";
document.getElementById("demo").innerHTML = x + y;
</script>

</body>
</html>

NaN on numero: NaN-tyyppi palauttaa numeron:

Esimerkki

typeof NaN;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>The typeof NaN is number:</p>

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

<script>
let x = NaN;
document.getElementById("demo").innerHTML = typeof x;
</script>

</body>
</html>



ääretön

Infinity (tai -Infinity) on arvo, jonka JavaScript palauttaa, jos lasket luvun suurimman ulkopuolella mahdollinen numero.

Esimerkki

let myNumber = 2;
// Execute until Infinity
while (myNumber != Infinity) {
    myNumber = myNumber * myNumber;
}

Jako 0:lla (nolla) tuottaa myös äärettömän:

Esimerkki

let x =  2 / 0;
let y = -2 / 0;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Division by zero generates Infinity;</p>

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

<script>
let x = 2/0;
let y = -2/0;
document.getElementById("demo").innerHTML = x + "<br>" + y;
</script>

</body>
</html>


Infinity on numero: Infinity-tyyppi palauttaa luvun.

Esimerkki

typeof Infinity;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Infinity is a number:</p>

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

<script>
document.getElementById("demo").innerHTML = typeof Infinity;
</script>

</body>
</html>



Heksadesimaali

JavaScript tulkitsee numeeriset vakiot heksadesimaaliluvuiksi, jos niitä edeltää 0x.

Esimerkki

let x = 0xFF;

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Numeric constants, preceded by 0x, are interpreted as hexadecimal:</p>

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

<script>
let x = 0xFF;
document.getElementById("demo").innerHTML = "0xFF = " + x;
</script>

</body>
</html>


Älä koskaan kirjoita numeroa, jonka alussa on nolla (kuten 07).
Jotkin JavaScript-versiot tulkitsevat numerot oktaaleina, jos ne on kirjoitettu alkunollalla.

Oletusarvoisesti JavaScript näyttää numerot 10 desimaaleina.

Mutta voit käyttää toString()-menetelmää numeroiden tulostamiseen kannasta 2 kantaan 36.

Heksadesimaali on kantaluku 16. Desimaaliluku on kantaluku 10. Octal on kantaluku 8. Binaari on kanta 2.

Esimerkki

let myNumber = 32;
myNumber.toString(32);
myNumber.toString(16);
myNumber.toString(12);
myNumber.toString(10);
myNumber.toString(8);
myNumber.toString(2);

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>The toString() method can output numbers from base 2 to 36:</p>

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

<script>
let myNumber = 32;
document.getElementById("demo").innerHTML =
"Decimal 32 = " + "<br><br>" + 

"Hexatrigesimal (base 36): " + myNumber.toString(36) + "<br>" +
"Duotrigesimal (base 32): " + myNumber.toString(32) + "<br>" +
"Hexadecimal (base 16): " + myNumber.toString(16) + "<br>" +
"Duodecimal (base 12): " + myNumber.toString(12) + "<br>" +
"Decimal (base 10): " + myNumber.toString(10) + "<br>" +
"Octal (base 8): " + myNumber.toString(8) + "<br>" +
"Binary (base 2): " + myNumber.toString(2);
</script>

</body>
</html>

JavaScript-numerot objekteina

Normaalisti JavaScript-luvut ovat primitiivisiä arvoja, jotka on luotu literaaleista:

let x = 123;

Mutta numerot voidaan myös määritellä objekteiksi avainsanalla new:

let y = new Number(123);

Esimerkki

let x = 123;
let y = new Number(123);

Älä luo numero-objekteja.

Avainsana uusi monimutkaistaa koodia ja hidastaa sen suoritusnopeutta.

Numeroobjektit voivat tuottaa odottamattomia tuloksia:

Kun käytät ==-operaattoria, x ja y ovat yht.:

let x = 500;
let y = new Number(500);

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Numbers and Number objects cannot be safely compared:</p>

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

<script>
// x is a number
let x = 500;

// y is an object
let y = new Number(500);
document.getElementById("demo").innerHTML = (x==y);
</script>

</body>
</html>

===-operaattoria käytettäessä x ja y eivät ole yhtä suuria.

let x = 500;
let y = new Number(500);

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Numbers and Number objects cannot be safely compared:</p>

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

<script>
// x is a number
let x = 500;

// y is an object
let y = new Number(500);

document.getElementById("demo").innerHTML = (x===y);
</script>

</body>
</html>

Huomaa ero (x==y) ja (x===y) välillä.

(x == y) tosi vai epätosi?

let x = new Number(500);
let y = new Number(500);

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>JavaScript objects cannot be compared:</p>

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

<script>
// x is an object
let x = new Number(500);

// y is an object
let y = new Number(500);

document.getElementById("demo").innerHTML = (x==y);
</script>

</body>
</html>

(x === y) tosi vai epätosi?

let x = new Number(500);
let y = new Number(500);

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>JavaScript objects cannot be compared:</p>

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

<script>
// x is an object
let x = new Number(500);

// y is an object
let y = new Number(500);

document.getElementById("demo").innerHTML = (x===y);
</script>

</body>
</html>

Kahden JavaScript-objektin vertailu aina palauttaa false.

Täydellinen JavaScript-numeroviite

Täydellisen numeroviitteen saat vierailemalla:

Täydellinen JavaScript-numeroviite.

Viite sisältää kuvauksia ja esimerkkejä kaikista Numeron ominaisuuksista ja menetelmistä.