logo

Chyby JavaScriptu:Přehled

Správa chyb a ladění kódu v JavaScriptu je jedním ze způsobů, jak zajistit, aby náš kód fungoval. V tomto článku se podíváme na běžné způsoby, jak můžeme ladit a spravovat chyby v našem kódu.

Konzole

Protokoly konzoly jsou nejlepším způsobem, jak můžeme zkontrolovat, co se děje v našem kódu. Protokoly konzoly lze zobrazit ve většině prohlížečů kliknutím pravým tlačítkem kdekoli na webové stránce a výběrem možnosti „Prozkoumat prvek“. Na záložce konzoly můžeme vidět všechny protokoly konzoly z našeho kódu JavaScript.

Chcete-li ke svému kódu přidat protokol konzoly, nejjednodušším způsobem je provést následující:

console.log("Hello!");

Pokud tento kód běží z našeho Javascriptu, pak v našem kódu uvidíme „Ahoj“. Toto je nejzákladnější způsob protokolování chyb nebo zpráv, ale existují i ​​​​jiné.

Další užitečné konzole

Můžeme použít protokoly konzoly ke správě toho, jak se chyby a zprávy objevují v našem kódu. Podívejme se, jak to funguje.

Chyby konzoly

Chyby jsou v konzolích většinou stylizované jinak a ukazují, že se něco podstatného zlomilo. Typicky jsou stylizované v červené barvě. Tím se nezastaví provádění zbytku vašeho kódu. Chybovou zprávu můžeme zobrazit pomocí console.error:

console.error("ERROR!");

Varování konzoly

Podobné chybám, ale obvykle žluté, aby uživatele upozornilo, že se očekávané chování mohlo změnit. Opět platí, že nezastaví provádění a lze je spustit následovně:

console.warning("warning!");

Časování pomocí konzol

U vysoce optimalizovaných systémů může být důležité zjistit, jak dlouho operace trvá. K tomu máme řadu konzolových operací, které můžeme použít:

console.time("my timer");
console.timeLog("my timer");
console.timeEnd("my timer");

Ve výše uvedeném máme jeden časovač, který začneme nazývat "můj časovač". Poté můžeme zaznamenávat časy proti "mému časovači" nebo jej úplně ukončit. Podrobněji, tyto dělají následující věci:

  • console.time - tím se spustí časovač, který poběží na pozadí s názvem "můj časovač". Můžete mít až 10 000 časovačů.
  • console.timeLog – tím se zaznamená čas pro „můj časovač“ v konkrétním bodě kódu od spuštění časovače.

  • console.timeEnd - tím se "můj časovač" úplně ukončí, takže proti němu nebudeme moci zaznamenávat časy. Zaznamená také čas.

    Chyby v JavaScriptu

    Javascript nám může poskytnout řadu různých chyb, které nám řeknou něco o tom, co jsme udělali špatně:

  • ReferenceError - pokusili jsme se odkazovat na proměnnou, která neexistovala.

  • EvalError - při pokusu o spuštění eval() došlo k problému.

  • TypeError - došlo k problému kvůli něčemu souvisejícímu s typem - tj. funkce očekávala jeden typ a dostala jiný.

  • RangeError - došlo k problému, když jsme se pokusili zavolat něco mimo rozsah toho, co se očekávalo, tj. zavolali jsme prvek pole, který neexistoval.

  • AggregateError - chyba, která obsahuje mnoho chyb.

  • URIError - máme neplatný řetězec URI nebo jsme nesprávně použili funkci URI.

    Předcházení chybám při porušení

    Všechny tyto chyby nám říkají něco o tom, proč je náš kód neplatný. Chybám se můžeme vyhnout napsáním kvalitního kódu a používáním podmíněných příkazů k zajištění platnosti proměnných. Než ji použijeme, mohli bychom například zkontrolovat, jaký typ proměnné je definován:

let i = 1;
if(typeof i !== "undefined") {
    i += 20;
}

Kontrola existence proměnných je běžný způsob, jak se vyhnout chybám – zejména pokud víme, že proměnná nemusí existovat, tj. pokud pochází z API nebo externího zdroje.

Zkuste ... Catch

Dalším způsobem, jak se vyhnout chybám, je použít příkazy try ... catch. Všechny chyby, které jsme zmínili v části „Chyby v Javascriptu“, jsou porušením kódu – to znamená, že kód přestane fungovat, pokud jsou vyvolány. Pomocí příkazů try ... catch můžeme zkusit nějaký kód, a pokud selže, zachytíme chybu. Pokud bylo chybou prolomení kódu, již kód prolomit nebude a v protokolu konzoly jednoduše dostaneme informační zprávu.

Takové prohlášení může vypadat takto:

try {
    // This throws an error since i is not defined.
    i += 20;
} catch(error) {
    // We can catch the error so the code will not break, and console log it.
    console.log(error);
}

try ... catch příkazy se stávají velmi důležitými, když se snažíme budovat servery Node.JS. Pokud dojde k chybě při prolamování kódu, může dojít ke zhroucení celého serveru – takže musíme chyby zachytit a náležitě s nimi naložit, abychom neohrozili zážitek pro všechny.

Zpracování konkrétních chyb pomocí Try ... Catch

Pokud chceme ošetřit konkrétní chybu, můžeme ji zachytit a zkontrolovat pomocí instanceof vlastnictví. Vypadá to asi takto:

try {
    // This throws an error since i is not defined.
    i += 20;
} catch(error) {
    // We can catch the error so the code will not break, and console log it.
    if(error instanceof ReferenceError) {
        console.log("This is a reference error");
    } else if(error instanceof EvalError) {
        console.log("This was an error with the eval() function");
    }
}

To nám umožňuje provádět konkrétní akce u konkrétních chyb, takže můžeme uživatelům poskytnout lepší zkušenost.

Generování vlastních chyb

Představte si nějaký kód, kde potřebujeme, aby existovala proměnná, jinak se zbytek kódu rozbije. Možná budeme chtít generovat vlastní chyby, abychom zastavili provádění kódu. Můžeme to udělat pomocí klíčového slova throw, kde text po throw je zpráva, kterou chceme, aby uživatel dostal. Například:

if(typeof i == "undefined") {
    throw "Could not find variable i";
}

Tato chyba vyvolá zprávu jako je tato:

Uncaught Could not find variable i

Můžeme dokonce použít čísla, objekty nebo booleany jako naše chybové zprávy. Pomocí této techniky můžeme také vytvořit nový chybový objekt se specifickými zprávami:

throw new Error("You made an error");

To nám dá zprávu, která vypadá asi takto:

Uncaught Error: You made an error at anonymous:1:7

Závěr

Děkujeme, že jste si přečetli tento průvodce chybami Javascriptu. Správné chybové hlášení je opravdu důležité v každém jazyce a Javscript není výjimkou (zamýšlená slovní hříčka ). V této příručce jsme se zabývali:

  • Různé typy protokolů konzoly v JavaScriptu, včetně varování a chyb.
  • Jak načasovat operaci pomocí konzole, aby se potenciálně optimalizoval váš kód.
  • Jak zachytit chyby, aby nenarušily celou vaši aplikaci.
  • Jak dávat konkrétní zprávy na základě typů chyb pomocí instanceof příkaz.