Suma totală în calculatorul de produse pe JavaScript
Să facem acum ca sub tabel să fie afișată suma totală a cumpărăturilor. Aici există nuanțe.
Dacă analizăm situația, devine clar că suma ar trebui ajustată nu doar la adăugarea unei noi cumpărături, ci și la ștergere și la editare.
Aș sugera în acest caz să creăm o anumită
funcție, să o numim recountTotal,
care va efectua recalcularea completă
a sumei. Adică va parcurge cu un ciclu toate
cumpărăturile și va suma conținutul coloanei
lor cost.
Având o astfel de funcție, o vom putea apela în orice loc unde se presupun unele modificări ale sumei totale. Desigur, puțin neoptim să calculăm de fiecare dată suma totală. Dar vom obține o simplificare substanțială a codului.
Vom folosi funcția propusă la crearea unei noi cumpărături:
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, 'șterge', 'remove');
table.appendChild(tr);
recountTotal(); // recalculăm suma totală
});
Iată schița funcției descrise:
function recountTotal() {
let costs = table.querySelectorAll('.cost');
if (costs) {
// găsim suma și o scriem în #total
}
}
Implementați funcția descrisă de mine recountTotal.