Consejos para depurar código con ejemplos de bucles en JavaScript

Ahora te enseñaré una metodología para buscar errores en el código. Imaginemos que por algún malentendido no seguiste los consejos de la lección anterior y obtuviste un código que no funciona. Veamos cómo encontrar los errores y lograr que funcione.

Muchos principiantes utilizan una metodología incorrecta de búsqueda. Toman y miran el código, con la esperanza de notar el error. Y así durante un par de horas. Esto no funciona así.

La metodología correcta es imprimir las variables en la consola y determinar si lo que contienen es lo que se necesita o no. Además, hay que comenzar desde el lugar supuesto del problema y avanzar hacia arriba en el código. Veámoslo en la práctica.

Supongamos que, por ejemplo, tenías la tarea de iterar sobre un array con números de dos dígitos y encontrar los números en los que el primer dígito es uno mayor que el segundo. Para simplificar, supongamos que el array almacena los números como cadenas.

Supongamos que resolviste el problema y obtuviste el siguiente 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); // devuelve 0

Sin embargo, el código devuelve 0. En este caso, lo primero que debe hacer es verificar si la ejecución del código entra en el if. Imprimamos algo en la consola dentro de él:

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('!'); // no imprime nada
		sum += elem;
	}
}

console.log(sum);

Como nada apareció en la consola, esto significa que la ejecución del código simplemente no entra en la condición. Veamos con nuestros propios ojos qué 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' y '11', '3' y '21' ...
	
	if (elem[0] === elem[1] + 1) {
		sum += elem;
	}
}

console.log(sum);

Como resultado, inmediatamente se vuelve visible que el segundo término tiene dos dígitos. Es fácil entender que esto se debe a que el uno se concatena como una cadena. Arreglemos el problema:

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

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

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

Después de la corrección, ya vemos que en la variable sum apareció algo, aunque incorrecto. Sin embargo, es visible que allí está lo que necesitamos, pero se concatenó como cadenas, y no como números. Arreglemos el 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; // corregimos
	}
}

console.log(sum); // todo funciona

Corrija los errores cometidos en el siguiente 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);