How to pass an argument that is passed to a function to the addeventlistener event handler?

Question

JavaScript

How to pass an argument that is passed to a function to the addeventlistener event handler?
You need to pass the total argument to addeventlistener and write btn.value into it

function getValue(trigger, total) {
      
      trigger.forEach(btn => {
         btn.addEventListener('click', (total) => {
            total = btn.value;
            totalSum.textContent = 'от ' + calcTypeValue * calcSmcValue * calcCalcValue * calcMoneyValue * 
            calcRegistrationValue * calcLogoValue * calcContentValue * calcPeriodValue + ' рублей';
            console.log(calcTypeValue);
            console.log(total);
         });
      });
   }

getValue(calcType, calcTypeValue);
   getValue(calcPeriod, calcPeriodValue);
   getValue(calcSmc, calcSmcValue);
   getValue(calcContent, calcContentValue);
   getValue(calcCalc, calcCalcValue);
   getValue(calcMoney, calcMoneyValue);
   getValue(calcLogo, calcLogoValue);
   getValue(calcRegistration, calcRegistrationValue);

Answer 1

what is going on anyway?
why EVERY TIME register new event listeners for all triggers (calculator buttons and sliders?)
, especially if total = btn.value; that is, total is not passed from outside, but it can be obtained from the clicked button by value

Answer 2

We fill in the missing knowledge here:
https://developer.mozilla.org/en/docs/Web/JavaScri...
https://developer.mozilla.org/en/docs/Web/API/Even...
and the question will disappear by itself...
Well, and more:
https://developer.mozilla.org/en/docs/Web/JavaScri...
https://developer.mozilla.org/en-US/docs/Web/API/N ...
we understand that this is a cycle under the hood: we understand that at each iteration of this cycle we create a function here: and we are horrified at how much processor time and memory we gobbled up for nothing trigger.forEach(btn => {(total) => {