23. diel - Práca s číslami a knižnica Math v JavaScripte

V predchádzajúcom kvíze, Kvíz - Pokročilé podmienky a cykly v JavaScripte, sme si overili nadobudnuté skúsenosti z predchádzajúcich lekcií.

Dnes sa v JavaScript tutoriále podrobne pozrieme na prácu s číslami a predstavíme si knižnicu Math, ktorá poskytuje užitočné matematické funkcie.

Práca s číslami

S číslami je možné samozrejme vykonávať väčšinu nám známych základných operácií ako sčítanie, odčítanie, násobenie a delenie. Použijeme na to známych operátorov +, -, * a /.

Mali by sme už vedieť tiež vypočítať zvyšok po celočíselnom delení, takzvané modulo, pre ktoré využívame operátor %.

Percentá sa na slovenskej klávesnici napíšu pomocou Shift a nasledujúce klávesy:

Okrem klasických operátorov si pripomeňme operátorov unárne. Zápis i++ použijeme najmä vo for cykle, v ktorom takto zvyšujeme hodnotu premennej i o 1. Keby sme chceli túto hodnotu naopak znižovať, použijeme zápis i--. Existujú aj varianty ++i a --i, ktoré je možné využiť pri výpise aktuálnej hodnoty premennej. Daná hodnota sa najprv vypíše a ihneď potom dôjde k jej navýšeniu alebo zníženiu.

Nakoniec spomeňme operátorov priradenia s operáciou – +=, -=, *= a ďalšie. Tie umožňujú skrátiť napríklad zápis a = a + 5; na a += 5;. Podobne je možné takto hodnotu premennej odčítať, násobiť alebo deliť.

Poďme si ale ukázať ďalšie možnosti, ako pracovať s číslami.

Klasický a exponenciálny zápis čísel

Čísla je možné zapísať dvoma spôsobmi. Klasickým zápisom, ako sme zvyknutí. Tento zápis je najbežnejší a používa sa pre väčšinu numerických operácií:

let x = 10;
let y = 2.25;

Druhý spôsob predstavuje exponenciálny zápis, známy tiež ako zápis s pohyblivou desatinnou čiarkou. Využíva notácie e alebo E, ktorá reprezentuje "krát desať na mocninu". Je užitočný pri deklarácii premenných s veľmi veľkým alebo veľmi malým číslom:

let x = 23e5; // 2 300 000 (= 23*10^5)
let y = 146e-7; // 0,0000146 (= 146*10^-7)

Funkcia isNaN()

Pomocou tejto funkcie zistíme, či je v premennej uložená číselná hodnota.

NaN je skratkou Not a Number a funkcia vracia true, pokiaľ v premennej nenájde číslo:

let jmeno = "Bára";
let vek = 22;
let vyska = "168 cm";
let telefonniCislo = "123456789";

document.write(isNaN(jmeno) + "<br />");
document.write(isNaN(vek) + "<br />");
document.write(isNaN(vyska) + "<br />"); // vráti true
document.write(isNaN(telefonniCislo)); // vráti false

Výsledok v prehliadači:

Formátovanie čísel

Číselné hodnoty môžeme formátovať pomocou nasledujúcich metód:

• toPrecision() – Oreže číslo na počet požadovaných znakov, ktoré uvedieme v parametri (v zátvorkách) metódy.
• toExponential() – Prevedie číslo na exponenciálnu notáciu, v parametri uvádzame počet desatinných miest v exponenciálnom zápise.
• toString() – Prevedie číslo na textový reťazec. Táto metóda má nepovinný parameter, v ktorom je možné špecifikovať požadovanú číselnú sústavu (2 - 36).

Ukážme si to prakticky:

let polomer = 123.456;
const obsah = 47857.942;
let id = 228;

document.write(polomer.toPrecision(4) + "<br />");
document.write(obsah.toPrecision(2) + "<br />");
document.write(obsah.toExponential(3) + "<br />");
document.write(id.toString() + "<br />");
document.write(id.toString(16) + "<br />");
document.write(typeof id.toString());

Výsledok v prehliadači:

Vlastnosti MAX_VALUE a MIN_VALUE

Pri matematických výpočtoch a manipulácii s číslami býva dôležité skontrolovať, či naše hodnoty neprekračujú extrémne rozsahy. K tomu využijeme vlastnosti MAX_VALUE a MIN_VALUE, ktoré nám vrátia najväčšie alebo najmenšie kladné číslo v JavaScripte:

let nejvetsiHodnota = Number.MAX_VALUE;
let nejmensiHodnota = Number.MIN_VALUE;

document.write("Najväčšia možná hodnota: " + nejvetsiHodnota + "<br />");
document.write("Najmenšia možná hodnota (väčšia ako 0): " + nejmensiHodnota);

Výsledok v prehliadači:

Knižnica Math

Základné matematické funkcie sú v JavaScripte obsiahnuté v knižnici Math. Knižnica nám poskytuje dve základné konštanty PI a E Konštanta PI je pochopiteľne číslo Pí (3.1415...) a E je Eulerovo číslo, teda základ prirodzeného logaritmu (2.7182...).

Tu sú najčastejšie používané konštanty a funkcie:

Math.PI         // číslo PI
Math.E          // Eulerovo číslo
Math.min()      // vráti najmenšie číslo
Math.max()      // vráti najväčšie číslo
Math.pow()      // mocnina, v parametri zadávame základ a exponent
Math.sqrt()     // druhá odmocnina
Math.random()   // náhodné číslo 0 – 1
Math.abs()      // absolútna hodnota čísla
Math.round()    // zaokrúhlenie
Math.ceil()     // zaokrúhlenie hore
Math.floor()    // zaokrúhlenie nadol
Math.cos()      // cosinus
Math.sin()      // sinus
Math.log()      // prirodzený logaritmus (základom je Eulerovo číslo)

Goniometrické funkcie (sin(), cos() a ďalšie) vracajú hodnotu pre uhol v radiánoch, ktorý odovzdáme ako parameter.

Ukážme si pár konkrétnych príkladov. Začneme mocninou:

let zaklad = 2;
let exponent = 3;
let mocnina = Math.pow(zaklad, exponent);
document.write(zaklad + " na " + exponent + " je " + mocnina);

Výsledok v prehliadači:

Takto vypočítame odmocninu:

let zaklad = 9;
let odmocnina = Math.sqrt(zaklad);
document.write("Druhá odmocnina čísla " + zaklad + " je " + odmocnina);

Výsledok v prehliadači:

Nakoniec si ukážeme použitie funkcie sin(). Tá ako parameter berie uhol v radiánoch, vstup v stupňoch musíme teda najskôr na radiány previesť:

let uhelVeStupnich = 90;
let uhelVRadianech = uhelVeStupnich * (Math.PI / 180); // prevod stupňov na radiány
let vysledek = Math.sin(uhelVRadianech);
document.write("Sinus úhlu " + uhelVeStupnich + " stupňů je " + vysledek);

Výsledok v prehliadači:

Zisťovanie dátového typu premennej

Dátový typ premennej zistíme pomocou operátora typeof. Ukážme si to na jednoduchom príklade. Deklarujeme v ňom niekoľko premenných a následne vypíšeme ich dátový typ:

let delka = 16;
let sirka = 7.5;
const jednotka = "cm";
let jeDelsi = true;
let barva;

document.write(typeof delka + "<br />");
document.write(typeof sirka + "<br />");
document.write(typeof jednotka + "<br />");
document.write(typeof jeDelsi + "<br />");
document.write(typeof barva);

V prehliadači sa nám vypíše:

V budúcej lekcii, Obrázky a kreslenie na canvas v JavaScripte , sa budeme venovať práci s obrázkami.

 

Mal si s čímkoľvek problém? Stiahni si vzorovú aplikáciu nižšie a porovnaj ju so svojím projektom, chybu tak ľahko nájdeš.