JavaScript zkráceně JS je dnes velmi mocný nástroj plný různých “kouzel” jelikož jeho syntaxe a zápisy jsou velmi hybridní. Pro jednu akci existuje hned několik zápisů…

<aside> 💡 JS je jazyk běžící na straně klienta, i když dnes již může běžet i na serveru.

</aside>

<aside> ⚠️ POZOR! JavaScript není od slova Jawa (motorka) ani Java (programovací jazyk)! Shoda jmen je jen skrze popularitu Java klem roku 1996!

</aside>

V JS neexistují datové typy, a to umožňuje dopustit se spousty chyb. JS je označován za dětský jazyk a jeho vyspělým bratrem je pak 🚧 TypeScript kde již datové typy existují a lze s ním pracovat stejně jako s JS.

<aside> ☝ Před studiem 🚧 TypeScript je nutné mít základy JavaScriptu!

</aside>

<aside> ☝

Pokud máte problém pochopit programování, existuje technika, kterou lze pochopit nutný základ jednoduše. Tato technika je vysvětlena na samostatné stránce zobrazené níže - v každém jazyku může být jinak nazvána:

Jak pochopit programování

</aside>

Kde se píše jazyk JavaScript a jak se píše (vývojové prostředí = IDE)

Tento jazyk ostatně jako všechny ostatní jazyky se píše v IDE (Integrated development environment). Ovšem nic nebrání ničemu psát kód uvnitř textového editoru jako je třeba Notapad (Windows), TextEdit (Mac), Vim (Linux, Mac). Ovšem psát kód v textovém editoru není zrovna pohodlné.

WebStorm - JetBrains s.r.o.

WebStorm - JetBrains s.r.o.

https://www.youtube.com/watch?v=gQe3LHU7F_U

Visual Studio Code - Microsoft

Visual Studio Code - Microsoft

Jazyk JavaScript je možné psát i na webu - zkuste si vyhledat JavaScript Online Compiler

Správné IDE vám umí i nainstalovat potřebné nástroje nebo poradit co máte dělat, špatné IDE vám moc nepomůže a budete muset vše řešit z hlavy a toho co znáte. Textový editor je formou špatného IDE. Mezi textové editory se řadí i VS Code - IDE se z něj stává v momentě, kdy jej nabušíte pluginama, ale za cenu rychlosti celého VS Code - jde totiž o hybridní webové IDE.

<aside> 💡 Jak vybrat správné IDE (prostředí)?

Před tím, než si hloupě vyberete IDE, prozkoumejte nejprve IDE - Vývojové prostředí a zjistěte co vám každé nabízí.

</aside>

Osobně používám JetBrains IDEs, protože mi vždy nainstalují vše co daný kód potřebuje a mají více jak dokonalou našeptávací techniku a nespočet integrovaných možností a propojení systému - tedy nemusím používat více aplikací = více oken.

VS Code používám jako rychlý editor - tedy pro projekty co chci jen otevřít, spustit skrze příkazový řádek a zvýraznit text. Pro vývoj reálného projektu bych jej osobně nepoužil, jelikož víc času strávím psaním kódu nebo hledáním vhodného pluginu než problémem, který mám v kódu vyřešit.

Jazyk JavaScript se nejčastěji píše v camelCase, který je pro tento jazyk standardem. Části pak v PascalCase a jiné zase v UPPER_CASE_SNAKE_CASE to jaký styl píšete určuje co konkrétně v kódu píšete!

Více si přečtěte v: Type Cases

Nekombinujte více stylů na stejné části kódu! Tedy nepiště proměnné tak jak se vám to zrovna hodí!

<aside> ☝ Pozor na pojmenování! V ukázce níže a všech následujících je použit jeden typ casů (text cases) - camelCase.

Z ukázky níže: run je psán v camelCase timeZone je psán v camelCase

Každý jazyk a framework má svůj styl jakým se tato pojmenování musí dodržovat!

Více si přečtěte v: Type Cases

</aside>

Ukázka jazyka JavaScript

let time = 100;
const timeZone = "Prague";

function run() {
	// výpis textu do konzole
	console.log(time + " x " + timeZone);
}

run();

Vysvětlení základní orientace

let time = 100 - je definice proměnné time s hodnout 100 - jedná se o datový typ number.

const timeZone = 100 - je definice konstanty zone s hodnout Default - jedná se o datový typ string.

function run() { ... } - je funkce, která se zavolá při spuštění programu. Kód bez této funkce nemůže nikdy fungovat a je nefunkční. Uvnitř této funkce se volají další funkce, které jsou napsané v jiných částech programu a knihovnách. Například console.log().

// výpis textu Jedná se o jednořádkový komentář, pokud chcete víceřádkový komentář využije /* ... multilene code ... */

console.log(time + " x " + timeZone); - je funkce, která umožňuje výpis (tisk) zadaného textu na do konzole prohlížeče. Tu zobrazíte ve většině prohlížečů skrze klávesy *F12* (Windows) *Option + Command + c* (macOS) a následně překliknutím na konzoli.

W3Schools.com

Vlastnosti, struktura jazyka a syntaxe

Jedná se o C-like jazyk, takže struktura je velmi podobná té z jazyka C ( Programování v jazyce C). Pokud tedy znáte základy jazyka C, znáte i základy JavaScriptu. Rozdíl je v definici, tedy bez datových typů, použití slovíček u proměnných jako je let var const nebo to, že jazyk JS není synchronní (nečeká na operace zavolaná před jinou operací).

JavaScript také není přímo objektový i když má objekty! Tedy lze říci, že je i není. I když většina zdrojů bude tvrdit že objektový je! Já bych jej nazval Pseudo-objektovým jazykem.

Na co každý začátečník zapomíná!

<aside> ⚠️ JS je asynchronní jazyk!

Pokud čekáte že funkce vrátí data až za nějaký čas, JavaScript tuto část “přeskočí” a jede dál. Nečeká jako synchronní jazyk na dokončení operace než začne druhou!

</aside>