Bendra suma produktų skaičiuoklėje JavaScript

Dabar padarykime taip, kad po lentele būtų rodoma bendra pirkinių suma. Čia yra niuansų.

Jei apgalvosite situaciją, tampa suprantama, kad suma turi koreguotis ne tik pridedant naują pirkinį, bet taip pat ir trinant bei redaguojant.

Aš siūlyčiau tokiu atveju padaryti tam tikrą funkciją, pavadinkime ją recountTotal, kuri atliks visišką sumos perskaičiavimą. Tai yra, ciklu pereis per visus pirkinių ir susumuos jų stulpelio cost turinį.

Turėdami tokią funkciją, galėsime ją iškviesti bet kurioje vietoje, kur numatomos kokie nors bendros sumos pakeitimai. Žinoma, šiek tiek ne optimalu kaskart perskaičiuoti bendrą sumą. Tačiau gausime esminį kodo supaprastinimą.

Naudokime numatytą funkciją kuriant naują pirkinių:

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, 'pašalinti', 'remove');
	
	table.appendChild(tr);
	recountTotal(); // perskaičiuosime bendrą sumą
});

Štai aprašytos funkcijos ruošinys:

function recountTotal() {
	let costs = table.querySelectorAll('.cost');
	
	if (costs) {
		// randame sumą ir įrašome ją į #total
	}
}

Įgyvendinkite mano aprašytą funkciją recountTotal.