Tipps zur Code-Debugging am Beispiel von Schleifen in JavaScript

Jetzt werde ich Ihnen die Methodik zur Fehlersuche im Code beibringen. Stellen wir uns vor, Sie haben aus einem Missverständnis heraus die Ratschläge aus der vorherigen Lektion nicht befolgt und einen nicht funktionierenden Code erhalten. Lassen Sie uns schauen, wie man Fehler findet und ihn zum Laufen bringt.

Viele Anfänger verwenden eine falsche Suchmethodik. Sie nehmen den Code und schauen ihn an, in der Hoffnung, den Fehler zu bemerken. Und das so ein paar Stunden lang. So funktioniert das nicht.

Die richtige Methodik ist das Ausgeben von Variablen in die Konsole und zu prüfen, ob das, was dort steht, das ist, was sein soll, oder nicht. Dabei sollte man an der vermuteten Problemstelle beginnen und sich im Code nach oben bewegen. Lassen Sie uns das in der Praxis ansehen.

Nehmen wir als Beispiel an, Ihre Aufgabe war es, ein Array mit zweistelligen Zahlen zu durchlaufen und die Zahlen zu finden, bei denen die erste Ziffer um eins größer ist als die zweite. Der Einfachheit halber seien die Zahlen im Array als Strings gespeichert.

Nehmen wir an, Sie haben die Aufgabe gelöst und den folgenden Code erhalten:

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

Der Code gibt jedoch 0 aus. In diesem Fall sollte man zunächst prüfen, ob die Codeausführung in das If-Statement hineingelangt. Geben wir darin etwas in der Konsole aus:

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('!'); // gibt nichts aus
		sum += elem;
	}
}

console.log(sum);

Da in der Konsole nichts erschien, bedeutet das, dass die Codeausführung einfach nicht in die Bedingung hineingeht. Lassen Sie uns mit eigenen Augen sehen, was wir da vergleichen:

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

console.log(sum);

Dadurch wird sofort sichtbar, dass der zweite Summand zweistellig ist. Es ist leicht zu verstehen, dass das daran liegt, dass die Eins als String addiert wird. Korrigieren wir das Problem:

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

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

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

Nach der Korrektur sehen wir bereits, dass in der Variable sum etwas aufgetaucht ist, wenn auch nicht korrekt. Es ist jedoch ersichtlich, dass dort das liegt, was wir brauchen, es sich aber als Strings addiert hat, und nicht als Zahlen. Korrigieren wir das Problem:

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

console.log(sum); // alles funktioniert

Korrigieren Sie die Fehler, die im folgenden Code gemacht wurden:

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