Ukázkové JavaScript kartičky z naší aplikace

Stáhněte si naši aplikaci z App Store nebo Google Play a získejte více zdarma fishek nebo se přihlaste k odběru pro přístup ke všem fishek.

Co je lexikální oblast platnosti v JavaScriptu?

Lexikální obor ve JavaScriptu je princip, kde je dosah proměnné určen jejím umístěním v kódu. To znamená, že proměnné jsou přístupné uvnitř bloku, ve kterém byly definovány, stejně jako v jakýchkoli vnořených blocích. To umožňuje vytváření uzávěrů a kontrolu nad přístupem k proměnným. Příklad použití lexikálního rozsahu v kódu JavaScriptu:

function outerFunction() {
  let outerVariable = `Jsem venku!`;

  function innerFunction() {
    console.log(outerVariable); // Má přístup k 'outerVariable'
  }

  innerFunction();
}
outerFunction(); // Zobrazí `Jsem venku!`

Lexikální obor umožňuje vnitřní funkci přistupovat k proměnným definovaným ve vnější funkci, i poté, co vnější funkce skončila. Toto je klíčový prvek při vytváření uzávěrů v JavaScriptu, který umožňuje flexibilnější správu stavů v aplikacích.

Co je hoisting?

Hoisting je mechanismus v jazyce JavaScript, kde se proměnné a funkce přesunou na začátek svého dosahu před provedením kódu. V praxi to znamená, že můžeme používat funkce nebo proměnné dříve, než jsou skutečně deklarovány.

Nicméně, je třeba poznamenat, že proměnné a funkce fungují mírně odlišně.

Pro proměnné deklarované klíčovými slovy var se připraví pouze deklarace, nikoli inicializace. Proměnné inicializované před deklarací budou vráceny jako undefined.

Příklad kódování pro proměnné:

console.log(myVar); // undefined
var myVar = 5;
console.log(myVar); // 5

U funkcí hoisting přesune jak deklaraci, tak definici funkce na začátek, což umožňuje použití funkce před její deklarací.

Příklad kódování pro funkce:

console.log(myFunction()); // "Hello World"

function myFunction() {
  return "Hello World";
}

Proměnné deklarované let a const nejsou připraveny.

Co je šipková funkce a jaké má výhody?

Šipková funkce, známá také jako funkce šipka, je typ funkce zavedený v ECMAScript 6 (ES6). Jsou nazývány šipkové funkce, protože používají speciální syntaxi se šipkou ( => ) k definování funkce.

Pro srovnání, tradiční funkce by mohla vypadat takto:

function sum(a, b) {
  return a + b;
}

Její ekvivalent jako šipková funkce je:

const sum = (a, b) => a + b;

Hlavní výhodou šipkové funkce je, že nevytváří vlastní kontext provedení (vazbu na this), který je často zdrojem chyb v JavaScriptu. Ve šipkových funkcích je this zděděno z okolního kontextu. Další výhodou je stručnost syntaxe, obzvláště užitečná, když jsou funkce používány jako argumenty jiných funkcí, např. u funkcí vyšších řádů.

Na druhou stranu, kvůli absenci vlastního this, nejsou šipkové funkce vhodné pro definování konstruktorových (tvůrčích) objektů nebo pro vytváření metod v prototypových objektech.

Co je objekt Promise a jak se používá?

Objekt Promise v JavaScriptu se používá pro zpracování asynchronních operací. Promise reprezentuje hodnotu, která nemusí být v době vytvoření objektu Promise dostupná, ale může být dostupná v budoucnosti, nebo nikdy.

Objekt Promise může být v jednom ze tří stavů:
1. Čeká - operace stále probíhá, není úspěšně ani s chybami dokončena.
2. Splněno - operace byla úspěšně dokončena, Promise vrátila hodnotu.
3. Odmítnuto - operace byla dokončena s chybou, Promise vrátila důvod chyby.

Promise, který byl splněn nebo odmítnut, je považován za "vyřízený" a jeho stav se již nikdy nemění.

Vytvoření objektu Promise:

const promise = new Promise((resolve, reject) => {
  const success = true;
  if (success) {
    resolve('Operace byla úspěšná.');
  } else {
    reject('Operace se nezdařila.');
  }
});

Použití objektu Promise:

promise
  .then(result => {
    console.log(result); // Vypíše: 'Operace byla úspěšná.'
  })
  .catch(error => {
    console.log(error);
  });

Metoda .then() se provádí, když je Promise splněn a .catch(), když je odmítnut. V obou případech je jako argument předán výsledek operace nebo důvod odmítnutí Promise.

Co je callback?

Callback, také označovaný jako callback funkce, je funkce, která je předána jako argument jiné funkci a poté je provedena (zavolána zpět) po dokončení této funkce. Callback funkce se běžně používají v JavaScriptu, zejména při asynchronních operacích, jako jsou AJAX požadavky nebo manipulace s událostmi.

Callback funkce obvykle přijímají výsledky určité operace jako argumenty, takže je lze použít na zpracování nebo analýzu těchto výsledků.

Použití takové funkce v praxi může vypadat následovně:

function executeAfterTimeout(callback, timeout) {
  setTimeout(() => {
    console.log('Time passed!');
    callback();
  }, timeout);
}

executeAfterTimeout(() => {
  console.log('This is a callback!');
}, 2000);

V tomto případě funkce `executeAfterTimeout` přijímá `callback` funkci jako parametr, který bude proveden po uplynutí určitého množství času. Callback funkce jsou mimořádně užitečné pro řízení asynchronního řídícího toku v JavaScriptu.

Co je operátor nullish coalescing a jak funguje?

Operátor nulového slučování (??) je logický operátor, který vrátí pravou stranu operace, pokud je levá strana null nebo undefined. Jinými slovy, pokud je proměnná prázdná, operátor nulového slučování vrátí definovanou hodnotu jako výsledek.

Základní zápis je:

let hodnota = null ?? 'výchozí hodnota';

V tomto případě, protože je levá strana (hodnota) null, výsledkem je 'výchozí hodnota'. Navíc se tento operátor liší od operátoru OR (||), protože funkce OR vrátí pravou stranu, když je levá strana false (false, 0, '', null, undefined, NaN), zatímco operátor nulového slučování vrátí pravou stranu pouze pokud je levá strana null nebo undefined.

Příklad s OR:

let hodnota1 = 0 || 'výchozí';
console.log(hodnota1); // výstup: 'výchozí', protože 0 je false hodnota

Příklad s nulovým slučováním:

let hodnota2 = 0 ?? 'výchozí';
console.log(hodnota2); // výstup: 0, protože 0 není null ani undefined

Takže na rozdíl od OR operátor nulového slučování nebere 0, '' a NaN jako "prázdné" hodnoty.

Co je Symbol a kdy by měl být použit?

Symbol v JavaScriptu je unikátní a neměnný datový typ, který se často používá k identifikaci unikátních vlastností objektů.

Symbol můžete vytvořit voláním konstruktoru Symbol(), který pokaždé, když je volán, vytvoří unikátní symbol. I když voláme konstruktor Symbol() se stejným argumentem, každý vytvořený symbol bude odlišný.

const symbol1 = Symbol('mujSymbol');
const symbol2 = Symbol('mujSymbol');
console.log(symbol1 === symbol2); // vrátí false

Symbol se často používá k definování (unikátních) vlastností objektů, zejména když chceme, aby tato vlastnost byla skrytá nebo soukromá. Také pokrývá vlastnosti, které nejsou brány v úvahu při iterování nad objekty pomocí for...in nebo for...of a nejsou vráceny metodou Object.keys(). Navíc symboly umožňují vytváření "pseudo" soukromých vlastností.

let obj = {};
let soukromaVlastnost = Symbol('soukroma');

obj[soukromaVlastnost] = 'Tohle je soukrome';

console.log(obj[soukromaVlastnost]); // 'Tohle je soukrome'
console.log(Object.keys(obj)); // []

Neexistuje žádné pevné pravidlo kdy používat Symbol. Obvykle se používají, když chceme na objektu vytvořit unikátní vlastnost, která nemůže být snadno viděna nebo změněna, nebo chceme definovat metody, které ovlivňují chování objektů na nízké úrovni.

Co jsou WeakMap a WeakSet?

WeakMap a WeakSet jsou speciální verze JavaScriptových objektů Map a Set, které nebrání automatickému uvolnění paměti Garbage Collectorem.

WeakMap je sbírka párů klíč-hodnota, kde klíče musí být objekty a hodnoty mohou být cokoliv. Hlavní rozdíl mezi Map a WeakMap spočívá v tom, že klíče v WeakMap jsou drženy "slabě", což znamená, že pokud neexistují žádné další reference na objekt klíče, bude vyčištěn Garbage Collectorem a jeho záznam v WeakMap bude automaticky odstraněn.

Zde je příklad použití WeakMap:

let john = { name: "John" };

let weakMap = new WeakMap();
weakMap.set(john, "...");

john = null; // přepsat referenci

// john je odstraněn z paměti!

WeakSet je podobný tomu, co je WeakMap k Map. Je to sada objektů, ale pokud objekt není viditelný nikde jinde, nezabrání tomu, aby byl odstraněn Garbage Collectorem. Chybí typické metody Set jako `size` a `clear` a metoda `add` přijímá pouze objekty.

Příklad použití WeakSet:

let john = { name: "John" };

let weakSet = new WeakSet();
weakSet.add(john);

john = null; // přepsat referenci

// john je odstraněn z paměti!

Oba, WeakMap i WeakSet, se hlavně používají v situacích, kdy chceme ukládat další informace o objektech, které by měly být odstraněny, když je samotný objekt odstraněn.

JavaScript Kartičky