V tomto tutoriále sa dozviete o ladení v JavaScripte pomocou príkladov.
Počas písania programov sa môžete stretnúť s chybami. Chyby nie sú nevyhnutne zlé. V skutočnosti nám väčšinou pomáhajú identifikovať problémy s našim kódom. Je nevyhnutné, aby ste vedeli, ako ladiť svoj kód a opraviť chyby.
Ladenie je proces preskúmania programu, nájdenia chyby a jej odstránenia.
Program JavaScript môžete ladiť rôznymi spôsobmi.
1. Používanie console.log ()
Pomocou tejto console.log()metódy môžete ladiť kód. Hodnotu, ktorú chcete skontrolovať, môžete vložiť do console.log()metódy a overiť, či sú údaje správne.
Syntax je:
console.log(object/message);
Môžete vložiť objekt dovnútra console.log()alebo jednoducho do reťazca správy.
V predchádzajúcom tutoriáli sme použili console.log()metódu na tlač výstupu. Túto metódu však môžete použiť aj na ladenie. Napríklad,
let a = 5; let b = 'asdf'; let c = a + b; // if you want to see the value of c console.log(c); // then do other operations if(c) ( // do something )
Použitím console.log()metódy v prehliadači sa otvorí hodnota v okne debuggera.
Fungovanie metódy console.log () v prehliadači
Nie console.log()je to špecifické pre prehliadače. Je k dispozícii aj v iných motoroch JavaScriptu.
2. Pomocou debuggeru
debuggerKľúčové slovo zastaví vykonávanie kódu a volá funkciu ladenia.
Je debuggerk dispozícii takmer vo všetkých motoroch JavaScriptu.
Pozrime sa na príklad,
let a = 6; let b = 9; let c = a * b; // stops the execution debugger; console.log(c);
Pozrime sa, ako môžete ladiaci program používať v prehliadači Chrome.
Práca debuggeru v prehliadači
Vyššie uvedený program pozastaví vykonávanie programu v riadku obsahujúcom debugger.
Po preskúmaní programu potom môžete obnoviť riadenie toku.
Zvyšok kódu sa spustí, keď skript obnovíte stlačením klávesu play v konzole.
Práca debuggeru v prehliadači
3. Stanovenie hraničných hodnôt
V okne debuggeru môžete nastaviť hraničné hodnoty pre kód JavaScript.
JavaScript sa zastaví v každom bode prerušenia a umožní vám preskúmať hodnoty. Potom môžete pokračovať v spustení kódu.
Pozrime sa na príklad nastavenia zarážky v prehliadači Chrome.
Práca s bodmi prerušenia v prehliadači
Hraničné hodnoty môžete nastaviť pomocou nástroja pre vývojárov kdekoľvek v kóde.
Nastavenie hraničných hodnôt je podobné ako vloženie ladiaceho programu do kódu. Tu iba nastavíte zarážky kliknutím na číslo riadku zdrojového kódu namiesto manuálneho volania funkcie debugger.
Vo vyššie uvedených metódach sme na zjednodušenie zobrazenia procesov ladenia použili prehliadač Chrome. Nie je to však vaša jediná možnosť.
Všetky dobré IDE poskytujú spôsob ladenia kódu. Proces ladenia môže byť trochu iný, ale koncepcia ladenia je rovnaká.
