Dicas para depurar código usando exemplos de loops em JavaScript

Agora vou te ensinar uma metodologia para encontrar erros no código. Vamos imaginar que, por algum equívoco, você não seguiu as dicas da lição anterior e acabou com um código que não funciona. Vamos ver como encontrar os erros e fazê-lo funcionar.

Muitos iniciantes usam uma metodologia incorreta de busca. Eles pegam e olham para o código, na esperança de que percebam o erro. E assim ficam por horas. Isso não funciona assim.

A metodologia correta é exibir os valores das variáveis no console e determinar se o que está lá é o que deveria estar ou não. Além disso, você deve começar do local presumido do problema e subir pelo código. Vamos ver na prática.

Vamos supor, por exemplo, que sua tarefa fosse iterar sobre um array com números de dois dígitos e encontrar os números onde o primeiro dígito é um a mais que o segundo. Para simplificar, vamos supor que o array armazena números como strings.

Vamos supor que você resolveu a tarefa e obteve o seguinte código:

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); // retorna 0

No entanto, o código retorna 0. Neste caso, a primeira coisa a verificar é se a execução do código está entrando no if. Vamos exibir algo no console dentro dele:

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('!'); // não exibe nada
		sum += elem;
	}
}

console.log(sum);

Como nada apareceu no console, isso significa que a execução do código simplesmente não está entrando na condição. Vamos ver com nossos próprios olhos o que estamos comparando:

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' e '11', '3' e '21' ...
	
	if (elem[0] === elem[1] + 1) {
		sum += elem;
	}
}

console.log(sum);

Como resultado, fica imediatamente visível que o segundo valor tem dois dígitos. É fácil entender que isso acontece porque o um está sendo concatenado como string. Vamos corrigir o problema:

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

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

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

Após a correção, já vemos que algo apareceu na variável sum, embora ainda incorreto. No entanto, é visível que está lá o que precisamos, mas foi concatenado como string, e não somado como números. Vamos corrigir o problema:

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; // corrigindo
	}
}

console.log(sum); // tudo funciona

Corrija os erros presentes no seguinte código:

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);