Lekce 23 - Práce s čísly a knihovna Math v JavaScriptu

Dnes se v JavaScript tutoriálu podrobně podíváme na práci s čísly a představíme si knihovnu Math, která poskytuje užitečné matematické funkce.

Práce s čísly

S čísly lze samozřejmě provádět většinu nám známých základních operací jako sčítání, odečítání, násobení a dělení. Použijeme k tomu známé operátory +, -, * a /. Měli bychom již umět také vypočítat zbytek po celočíselném dělení, takzvané modulo, pro které využíváme operátor %.

Procenta se na české klávesnici napíší pomocí Shift a následující klávesy:

Kromě klasických operátorů si připomeňme operátory unární. Zápis i++ použijeme zejména ve for cyklu, v němž takto zvyšujeme hodnotu proměnné i o 1. Kdybychom chtěli tuto hodnotu naopak snižovat, použijeme zápis i--. Existují také varianty ++i a --i, které lze využít při výpisu aktuální hodnoty proměnné. Daná hodnota se nejprve vypíše a ihned poté dojde k jejímu navýšení nebo snížení.

Nakonec zmiňme operátory přiřazení s operací – +=, -=, *= a další. Ty umožňují zkrátit například zápis a = a + 5; na a += 5;. Obdobně lze takto hodnotu proměnné odečítat, násobit nebo dělit.

Pojďme si ale ukázat další možnosti, jak pracovat s čísly.

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

Čísla lze zapsat dvěma způsoby. Klasickým zápisem, jak jsme zvyklí. Tento zápis je nejběžnější a používá se pro většinu numerických operací:

let x = 10;
let y = 2.25;

Druhý způsob představuje exponenciální zápis, známý také jako zápis s pohyblivou desetinnou čárkou. Využívá notace e nebo E, která reprezentuje "krát deset na mocninu". Je užitečný při deklaraci proměnných s velmi velkým nebo velmi malým číslem:

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

Funkce isNaN()

Pomocí této funkce zjistíme, zda je v proměnné uložená číselná hodnota. NaN je zkratkou Not a Number a funkce vrací true, pokud v proměnné nenalezne čí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átí true
document.write(isNaN(telefonniCislo)); // vrátí false

Výsledek v prohlížeči:

Formátování čísel

Číselné hodnoty můžeme formátovat pomocí následujících metod:

• toPrecision() – Ořízne číslo na počet požadovaných znaků, které uvedeme v parametru (v závorkách) metody.
• toExponential() – Převede číslo na exponenciální notaci, v parametru uvádíme počet desetinných míst v exponenciálním zápisu.
• toString() – Převede číslo na textový řetězec. Tato metoda má nepovinný parametr, v němž lze specifikovat požadovanou číselnou soustavu (2 - 36).

Ukaž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ýsledek v prohlížeči:

Vlastnosti MAX_VALUE a MIN_VALUE

Při matematických výpočtech a manipulaci s čísly bývá důležité zkontrolovat, zda naše hodnoty nepřekračují extrémní rozsahy. K tomu využijeme vlastnosti MAX_VALUE a MIN_VALUE, které nám vrátí největší nebo nejmenší kladné číslo v JavaScriptu:

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

document.write("Největší možná hodnota: " + nejvetsiHodnota + "<br />");
document.write("Nejmenší možná hodnota (větší než 0): " + nejmensiHodnota);

Výsledek v prohlížeči:

Knihovna Math

Základní matematické funkce jsou v JavaScriptu obsaženy v knihovně Math. Knihovna nám poskytuje dvě základní konstanty PI a E. Konstanta PI je pochopitelně číslo Pí (3.1415...) a E je Eulerovo číslo, tedy základ přirozeného logaritmu (2.7182...).

Zde jsou nejčastěji používané konstanty a funkce:

Math.PI         // číslo PI
Math.E          // Eulerovo číslo
Math.min()      // vrátí nejmenší číslo
Math.max()      // vrátí největší číslo
Math.pow()      // mocnina, v parametru zadáváme základ a exponent
Math.sqrt()     // druhá odmocnina
Math.random()   // náhodné číslo 0 – 1
Math.abs()      // absolutní hodnota čísla
Math.round()    // zaokrouhlení
Math.ceil()     // zaokrouhlení nahoru
Math.floor()    // zaokrouhlení dolů
Math.cos()      // cosinus
Math.sin()      // sinus
Math.log()      // přirozený logaritmus (základem je Eulerovo číslo)

Goniometrické funkce (sin(), cos() a další) vrací hodnotu pro úhel v radiánech, který předáme jako parametr.

Ukažme si pár konkrétních příkladů. Začneme mocninou:

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

Výsledek v prohlížeči:

Takto vypočítáme odmocninu:

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

Výsledek v prohlížeči:

Nakonec si ukážeme použití funkce sin(). Ta jako parametr bere úhel v radiánech, vstup ve stupních musíme tedy nejdříve na radiány převést:

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

Výsledek v prohlížeči:

Zjišťování datového typu proměnné

Datový typ proměnné zjistíme pomocí operátoru typeof. Ukažme si to na jednoduchém příkladu. Deklarujeme v něm několik proměnných a následně vypíšeme jejich datový 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 prohlížeči se nám vypíše:

V příští lekci, Obrázky a kreslení na canvas v JavaScriptu, se budeme věnovat práci s obrázky.

 

Měl jsi s čímkoli problém? Stáhni si vzorovou aplikaci níže a porovnej ji se svým projektem, chybu tak snadno najdeš.