Skupni znesek v kalkulatorju produktov v JavaScriptu

Poglejmo, kako lahko spodaj tabele prikažemo skupni znesek nakupov. Tu so nekatere nianse.

Če premislimo o situaciji, postane jasno, da se mora vsota prilagoditi ne le pri dodajanju novega nakupa, temveč tudi pri brisanju in urejanju.

V tem primeru bi predlagal, da naredimo neko funkcijo, poimenujmo jo recountTotal, ki bo izvajala popoln ponovni izračun vsote. Se pravi, da bo šla z zanko čez vse nakupe in seštela vsebino njihovega stolpca cost.

S takšno funkcijo jo bomo lahko klicali na katerem koli mestu, kjer pričakujemo kakršne koli spremembe skupnega zneska. Seveda je nekoliko ne optimalno vsakič izračunati skupno vsoto. Po drugi strani pa bomo dobili bistveno poenostavitev kode.

Uporabimo predvideno funkcijo pri ustvarjanju novega nakupa:

add.addEventListener('click', function() {
	let tr = document.createElement('tr');
	
	createCell(tr, name.value, 'name');
	createCell(tr, price.value, 'price');
	createCell(tr, amount.value, 'amount');
	createCell(tr, price.value * amount.value, 'cost');
	createCell(tr, 'izbriši', 'remove');
	
	table.appendChild(tr);
	recountTotal(); // preračunajmo skupni znesek
});

Tukaj je pripravljena opisana funkcija:

function recountTotal() {
	let costs = table.querySelectorAll('.cost');
	
	if (costs) {
		// poiščemo vsoto in jo zapišemo v #total
	}
}

Implementirajte opisano funkcijo recountTotal.