Shuma totale në kalkulatorin e produkteve në JavaScript

Lejo tani ta bëjmë në mënyrë që nën tabelë të shfaqet shuma totale e blerjeve. Këtu ka nuanca.

Nëse e mendojmë situatën, do të bëhet e qartë që shuma duhet të rregullohet jo vetëm gjatë shtimit të një blerjeje të re, por edhe gjatë fshirjes dhe gjatë modifikimit.

Unë do të sugjeroja në këtë rast të bëhet një funksion, le ta quajmë recountTotal, i cili do të kryejë rillogaritjen e plotë të shumës. Domethënë do të kalojë në cikël nëpër të gjitha blerjet dhe do të mbledhë përmbajtjen e kolonës së tyre cost.

Duke pasur një funksion të tillë, ne do të jemi në gjendje ta thirrim atë në çdo vend, ku parashikohen ndonjë ndryshime të shumës totale. Sigurisht, pak jo optimale të llogaritet çdo herë shuma e përgjithshme. Por ne do të marrim një thjeshtim të konsiderueshëm të kodit.

Le ta përdorim funksionin e propozuar gjatë krijimit të një blerjeje të re:

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, 'fshij', 'remove');
	
	table.appendChild(tr);
	recountTotal(); // rillogarit shumën totale
});

Këtu është gjedhe e funksionit të përshkruar:

function recountTotal() {
	let costs = table.querySelectorAll('.cost');
	
	if (costs) {
		// gjejmë shumën dhe e shkruajmë në #total
	}
}

Implementoni funksionin e përshkruar nga unë recountTotal.