Vianmääritysvinkkejä koodille esimerkkinä JavaScript-silmukat

Nyt opetan sinulle menetelmän virheiden etsimiseen koodista. Kuvittele, että jostakin väärinkäsityksestä et seurannut edellisen oppitunnin vinkkejä ja sait toimimattoman koodin. Katsotaan, kuinka löytää virheet ja saada se toimimaan.

Monet aloittelijat käyttävät väärää menetelmää etsintään. He ottavat ja katsovat koodia, toivoen, että he huomaavat virheen. Ja niin pari tuntia. Se ei toimi niin.

Oikea menetelmä on muuttujien tulostaminen konsoliin ja määrittää, onko siellä se, mikä tarvitaan, vai ei. Tässä tapauksessa on aloitettava oletetusta ongelmakohdasta ja liikuttava yhtä ylös koodia. Katsotaan käytännössä.

Olkoon esimerkiksi edessäsi ollut tehtävä käydä läpi taulukko kaksinumeroisilla luvuilla ja löytää ne luvut, joissa ensimmäinen numero on yksi suurempi kuin toinen. Olkoon yksinkertaisuuden vuoksi taulukossa tallennettuna luvut merkkijonoina.

Oletetaan, että ratkaisit tehtävän ja sait seuraavan koodin:

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

Koodi kuitenkin antaa 0. Tässä tapauksessa ensimmäiseksi on tarkistettava, katsomme mitä muuttujassa päätyykö koodin suoritus if-lauseeseen. Tulostetaan siinä jotain konsoliin:

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('!'); // ei tulosta mitään
		sum += elem;
	}
}

console.log(sum);

Koska konsoliin ei ilmestynyt mitään, tämä tarkoittaa, että koodin suoritus yksinkertaisesti ei päädy ehtoon. Katsotaan omin silmin, mitä oikein vertailemme:

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

console.log(sum);

Tuloksena heti tulee näkyviin, että toinen termi on kaksinumeroinen. On helppo ymmärtää, että tämä johtuu siitä, että ykkönen lisätään merkkijonona. Korjataan ongelma:

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

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

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

Korjauksen jälkeen näemme jo, että muuttujassa sum on jotain ilmestynyt, vaikkakin epäkorrektia. On kuitenkin nähtävissä, että siellä on se, mitä tarvitsemme, mutta se laskettiin yhteen merkkijonoina, eikä numeroina. Korjataan ongelma:

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

console.log(sum); // kaikki toimii

Korjaa seuraavassa koodissa tehdyt virheet:

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