Ընդհանուր գումարն ապրանքների հաշվիչում JavaScript-ում

Եկեք այժմ անենք, որ աղյուսակի տակ ցուցադրվի գնումների ընդհանուր գումարը։ Այստեղ կան նրբություններ։

Եթե մտածենք իրավիճակի մասին, ապա կհասկանանք, որ գումարը պետք է ճշգրտվի ոչ միայն նոր գնում ավելացնելիս, այլև ջնջելիս և խմբագրելիս։

Ես այդպիսի դեպքում կառաջարկեի ստեղծել որոշակի ֆունկցիա, անվանենք այն recountTotal, որը կկատարի ընդհանուր գումարի ամբողջական վերահաշվարկ։ Այսինքն՝ այն կանցնի ցիկլով բոլոր գնումների վրայով և կգումարի դրանց cost սյունակի պարունակությունը։

Նման ֆունկցիա ունենալով՝ մենք կկարողանանք այն կանչել ցանկացած տեղ, որտեղ ենթադրվում են ընդհանուր գումարի որոշ փոփոխություններ։ Իհարկե, մի քիչ ոչ օպտիմալ է ամեն անգամ հաշվարկել ընդհանուր գումարը։ Սակայն մենք կստանանք կոդի էական պարզեցում։

Եկեք օգտագործենք նախատեսված ֆունկցիան նոր գնում ստեղծելիս․

javascriptadd.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, 'ջնջել', 'remove');
  
  table.appendChild(tr);
  recountTotal(); // վերահաշվարկենք ընդհանուր գումարը
});

Ահա նկարագրված ֆունկցիայի դատարկ կաղապարը․

javascriptfunction recountTotal() {
  let costs = table.querySelectorAll('.cost');
  
  if (costs) {
    // գտնում ենք գումարը և գրում այն #total-ում
  }
}