Tipy pro ladění kódu na příkladu cyklů v JavaScriptu

Nyní vás naučím metodiku hledání chyb v kódu. Představme si, že jste z nějakého nedorozumění nedodržovali rady z předchozí lekce a získali jste nefunkční kód. Pojďme se podívat, jak najít chyby a přimět ho fungovat.

Mnoho začátečníků používá nesprávnou metodiku hledání. Vezmou a dívají se na kód, v naději, že si chyby všimnou. A tak pár hodin. Takhle to nefunguje.

Správnou metodikou je výpis proměnných do konzole a zjišťování, zda je v nich to, co má být, nebo ne. Přitom je třeba začít od předpokládaného místa problému a pohybovat se vzhůru podle kódu. Podívejme se na tom v praxi.

Předpokládejme pro příklad, že před vámi stál úkol projít pole s dvoucifernými čísly a najít čísla, u kterých je první číslice o jedna větší než druhá. Pro zjednodušení předpokládejme, že v poli jsou uložena čísla ve formě řetězců.

Předpokládejme, že jste úkol vyřešili a získali následující kód:

let arr = ['21', '32', '34', '43', '45', '54', '55'];
let sum = 0;

for (let elem of arr) {
	if (elem[0] === elem[1] + 1) {
		sum += elem;
	}
}

console.log(sum); // vypíše 0

Kód však vypíše 0. V tomto případě je prvním krokem zkontrolovat, zda se provádění kódu dostane do ifu. Vypišme v něm něco do konzole:

let arr = ['21', '32', '34', '43', '45', '54', '55'];
let sum = 0;

for (let elem of arr) {
	if (elem[0] === elem[1] + 1) {
		console.log('!'); // nic nevypíše
		sum += elem;
	}
}

console.log(sum);

Jelikož se v konzoli nic neobjevilo, znamená to, že se provádění kódu prostě nedostalo do podmínky. Podívejme se vlastníma očima, co vlastně porovnáváme:

let arr = ['21', '32', '34', '43', '45', '54', '55'];
let sum = 0;

for (let elem of arr) {
	console.log(elem[0], elem[1] + 1); // '2' a '11', '3' a '21' ...
	
	if (elem[0] === elem[1] + 1) {
		sum += elem;
	}
}

console.log(sum);

V důsledku je ihned vidět, že druhý sčítanec je dvouciferný. Snadno pochopíme, že je to kvůli tomu, že jednička se přičítá jako řetězec. Opravme problém:

let arr = ['21', '32', '34', '43', '45', '54', '55'];
let sum = 0;

for (let elem of arr) {
	if (+elem[0] === +elem[1] + 1) { // opravujeme
		sum += elem;
	}
}

console.log(sum); // '021324354'

Po opravě již vidíme, že v proměnné sum se něco objevilo, i když nekorektní. Je však vidět, že tam leží to, co potřebujeme, ale sešlo se to ve formě řetězců, a ne čísel. Opravme problém:

let arr = ['21', '32', '34', '43', '45', '54', '55'];
let sum = 0;

for (let elem of arr) {
	if (+elem[0] === +elem[1] + 1) {
		sum += +elem; // opravujeme
	}
}

console.log(sum); // vše funguje

Opravte chyby, kterých se dopustil následující kód:

let obj = {a: 10, b: 20, c: 30, d: 40, e: 50};
let sum = 0;

for (let elem in obj) {
	if (elem[0] === '1' && elem[0] === '2') {
		sum += +elem;
	}
}

console.log(sum);