Výukový program JS

JS HOME Úvod do JS JS Kam vést Výstup JS JS prohlášení Syntaxe JS Komentáře JS JS proměnné JS Let JS Const Operátoři JS JS aritmetika Zadání JS JS datové typy Funkce JS JS objekty Události JS JS struny JS String Methods JS String Search Šablony řetězců JS JS čísla Metody čísel JS JS Arrays Metody JS Array JS Array Sort Iterace pole JS JS Array Const JS Termíny Formáty data JS JS metody získávání data JS metody nastavení data JS Math JS Náhodný JS Booleans JS Srovnání Podmínky JS Přepínač JS JS Loop For JS Loop For In JS Loop For Of Zatímco JS Loop JS Break JS Iterables Sady JS Mapy JS Typ JS Konverze typu JS JS Bitwise JS RegExp Chyby JS Rozsah JS JS Zvedací zařízení Přísný režim JS JS toto klíčové slovo Funkce šipky JS JS třídy JS JSON Ladění JS Průvodce stylem JS JS Best Practices Chyby JS Výkon JS JS Reserved Words

Verze JS

Verze JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge Historie JS

JS objekty

Definice objektů Vlastnosti objektu Objektové metody Zobrazení objektu Objektové přístupové objekty Konstruktory objektů Prototypy objektů Iterovatelné objekty Sady objektů Mapy objektů Reference objektu

Funkce JS

Definice funkcí Funkční parametry Vyvolání funkce Volání funkce Funkce Použít Funkční uzávěry

JS třídy

Úvod do třídy Třídní dědičnost Třída Statická

JS Async

JS zpětná volání JS asynchronní JS Sliby JS Async/Await

JS HTML DOM

Úvod do DOM Metody DOM Dokument DOM Prvky DOM DOM HTML Formuláře DOM DOM CSS DOM animace Události DOM DOM Event Listener Navigace DOM DOM uzly Kolekce DOM Seznamy uzlů DOM

Kusovník prohlížeče JS

Okno JS Obrazovka JS Umístění JS Historie JS JS Navigator Popup Alert JS Časování JS Soubory cookie JS

Webová rozhraní API JS

Úvod do webového rozhraní API Web Forms API Webová historie API Web Storage API Web Worker API Web Fetch API Web Geolocation API

JS AJAX

Úvod do AJAXu AJAX XMLHttp Požadavek AJAX Odpověď AJAX Soubor XML AJAX AJAX PHP AJAX ASP Databáze AJAX Aplikace AJAX Příklady AJAX

JS JSON

Úvod do JSON Syntaxe JSON JSON vs XML Datové typy JSON Analýza JSON JSON Stringify Objekty JSON Pole JSON Server JSON JSON PHP JSON HTML JSON JSONP

JS vs jQuery

Selektory jQuery HTML jQuery jQuery CSS jQuery DOM

Grafika JS

Grafika JS JS Canvas JS Plotly JS Chart.js JS Google Chart JS D3.js

Příklady JS

Příklady JS JS HTML DOM Vstup HTML JS JS HTML objekty JS HTML události Prohlížeč JS Editor JS Cvičení JS JS kvíz Certifikát JS

JS Reference

Objekty JavaScriptu HTML DOM objekty


Proměnné JavaScriptu

4 způsoby, jak deklarovat proměnnou JavaScriptu:

  • Použitím var
  • Použitím let
  • Použitím const
  • Nepoužívat nic

Co jsou proměnné?

Proměnné jsou kontejnery pro ukládání dat (ukládání datových hodnot).

V tomto příkladu jsou x, y, a z, proměnné deklarované pomocí varklíčového slova:

Příklad

var x = 5;
var y = 6;
var z = x + y;

V tomto příkladu jsou x, y, a z, proměnné deklarované pomocí letklíčového slova:

Příklad

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

V tomto příkladu jsou x, y, a z, nedeklarované proměnné:

Příklad

x = 5;
y = 6;
z = x + y;

Ze všech výše uvedených příkladů můžete hádat:

  • x ukládá hodnotu 5
  • y ukládá hodnotu 6
  • z ukládá hodnotu 11

Kdy použít JavaScript var?

Proměnné JavaScriptu vždy deklarujte pomocí var, letnebo const.

Klíčové varslovo se používá ve všech kódech JavaScript od roku 1995 do roku 2015.

Klíčová slova leta constbyla přidána do JavaScriptu v roce 2015.

Pokud chcete, aby váš kód běžel ve starším prohlížeči, musíte použít var.


Kdy použít JavaScript const?

Pokud chcete obecné pravidlo: vždy deklarujte proměnné pomocí const.

Pokud si myslíte, že se hodnota proměnné může změnit, použijte let.

V tomto příkladu jsou price1, price2, a total, proměnné:

Příklad

const price1 = 5;
const price2 = 6;
let total = price1 + price2;

Dvě proměnné price1a price2 jsou deklarovány pomocí constklíčového slova.

Tyto hodnoty jsou konstantní a nelze je měnit.

Proměnná totalje deklarována pomocí letklíčového slova.

Toto je hodnota, kterou lze změnit.


Stejně jako Algebra

Stejně jako v algebře mají proměnné hodnoty:

let x = 5;
let y = 6;

Stejně jako v algebře se proměnné používají ve výrazech:

let z = x + y;

Z výše uvedeného příkladu můžete uhodnout, že součet je vypočítán na 11.

Poznámka

Proměnné jsou kontejnery pro ukládání hodnot.



JavaScriptové identifikátory

Všechny proměnné JavaScriptu musí být označeny jedinečnými názvy .

Tato jedinečná jména se nazývají identifikátory .

Identifikátory mohou být krátké názvy (jako x a y) nebo popisnější názvy (věk, součet, celkový objem).

Obecná pravidla pro vytváření jmen pro proměnné (jedinečné identifikátory) jsou:

  • Jména mohou obsahovat písmena, číslice, podtržítka a znaky dolaru.
  • Jména musí začínat písmenem
  • Názvy mohou také začínat $ a _ (ale v tomto tutoriálu je nepoužijeme)
  • V názvech se rozlišují velká a malá písmena (y a Y jsou různé proměnné)
  • Vyhrazená slova (jako klíčová slova JavaScriptu) nelze použít jako názvy

Poznámka

V identifikátorech JavaScriptu se rozlišují velká a malá písmena.


Operátor přiřazení

V JavaScriptu je rovnítko ( =) operátorem „přiřazení“, nikoli operátorem „rovná se“.

To se liší od algebry. Následující nedává v algebře smysl:

x = x + 5

V JavaScriptu to ale dává dokonalý smysl: přiřazuje hodnotu x + 5 x.

(Vypočítá hodnotu x + 5 a výsledek vloží do x. Hodnota x se zvýší o 5.)

Poznámka

Operátor "rovná se" se zapisuje jako ==v JavaScriptu.


Datové typy JavaScriptu

Proměnné JavaScriptu mohou obsahovat čísla jako 100 a textové hodnoty jako „John Doe“.

V programování se textové hodnoty nazývají textové řetězce.

JavaScript dokáže zpracovat mnoho typů dat, ale zatím si představte jen čísla a řetězce.

Řetězce jsou psány uvnitř dvojitých nebo jednoduchých uvozovek. Čísla se píší bez uvozovek.

Pokud vložíte číslo do uvozovek, bude s ním zacházeno jako s textovým řetězcem.

Příklad

const pi = 3.14;
let person = "John Doe";
let answer = 'Yes I am!';

Deklarování proměnné JavaScriptu

Vytvoření proměnné v JavaScriptu se nazývá „deklarování“ proměnné.

Proměnnou JavaScriptu deklarujete pomocí klíčového slova varnebo :let

var carName;
nebo:
let carName;

Po deklaraci nemá proměnná žádnou hodnotu (technicky je to undefined).

Chcete-li proměnné přiřadit hodnotu, použijte rovnítko:

carName = "Volvo";

Můžete také přiřadit hodnotu proměnné, když ji deklarujete:

let carName = "Volvo";

V níže uvedeném příkladu vytvoříme proměnnou s názvem carNamea přiřadíme jí hodnotu „Volvo“.

Potom „vypíšeme“ hodnotu uvnitř odstavce HTML s id="demo":

Příklad

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

<script>
let carName = "Volvo";
document.getElementById("demo").innerHTML = carName;
</script>

Poznámka

Je dobrým programátorským postupem deklarovat všechny proměnné na začátku skriptu.


Jedno prohlášení, mnoho proměnných

V jednom příkazu můžete deklarovat mnoho proměnných.

Začněte příkaz vara oddělte proměnné čárkou :

Příklad

let person = "John Doe", carName = "Volvo", price = 200;

Deklarace může zahrnovat více řádků:

Příklad

let person = "John Doe",
carName = "Volvo",
price = 200;

Hodnota = nedefinováno

V počítačových programech jsou proměnné často deklarovány bez hodnoty. Hodnota může být něco, co je třeba vypočítat, nebo něco, co bude poskytnuto později, jako je vstup uživatele.

Proměnná deklarovaná bez hodnoty bude mít hodnotu undefined.

Proměnná carName bude mít undefinedpo provedení tohoto příkazu hodnotu:

Příklad

let carName;

Opětovné deklarování proměnných JavaScriptu

Pokud znovu deklarujete proměnnou JavaScriptu deklarovanou pomocí var, neztratí svou hodnotu.

carNamePo provedení těchto příkazů bude mít proměnná stále hodnotu „Volvo“:

Příklad

var carName = "Volvo";
var carName;

Poznámka

Nemůžete znovu deklarovat proměnnou deklarovanou pomocí letnebo const.

Toto nebude fungovat:

let carName = "Volvo";
let carName;

Aritmetika JavaScriptu

Stejně jako u algebry můžete provádět aritmetiku s proměnnými JavaScriptu pomocí operátorů jako =a +:

Příklad

let x = 5 + 2 + 3;

Můžete také přidat řetězce, ale řetězce budou zřetězeny:

Příklad

let x = "John" + " " + "Doe";

Zkuste také toto:

Příklad

let x = "5" + 2 + 3;

Poznámka

Pokud vložíte číslo do uvozovek, zbytek čísel bude považován za řetězce a bude zřetězen.

Nyní zkuste toto:

Příklad

let x = 2 + 3 + "5";

JavaScript znak dolaru $

Protože JavaScript zachází se znakem dolaru jako s písmenem, identifikátory obsahující $ jsou platnými názvy proměnných:

Příklad

let $ = "Hello World";
let $$$ = 2;
let $myMoney = 5;

Používání znaku dolaru není v JavaScriptu příliš běžné, ale profesionální programátoři jej často používají jako alias pro hlavní funkci v JavaScriptové knihovně.

Například v JavaScriptové knihovně jQuery se hlavní funkce $používá k výběru prvků HTML. V jQuery $("p");znamená "vybrat všechny p elementy".


Podtržítko JavaScript (_)

Protože JavaScript považuje podtržítko za písmeno, identifikátory obsahující _ jsou platnými názvy proměnných:

Příklad

let _lastName = "Johnson";
let _x = 2;
let _100 = 5;

Používání podtržítka není v JavaScriptu příliš běžné, ale mezi profesionálními programátory je zvykem jej používat jako alias pro „soukromé (skryté)“ proměnné.


Otestujte se pomocí cvičení

Cvičení:

Vytvořte proměnnou s názvem carNamea přiřaďte jí hodnotu Volvo.

var  = "";