title: Can't override a function's inner variable
body: <p>Just me and my noob questions again. Trying to pass variables from event listeners inside a function and calculate their product (right now just logging them). Here's what it looks like:</p>
  
  <pre><code>getFactors(){
      document.addEventListener("click", e =&gt; {
          if(e.target.className === "radio_custom_label"){
              e.stopPropagation()
              this.doTheMath({first: e.target.getAttribute("for").split("_").pop()})
          }
      })
      document.addEventListener("change", e =&gt; {
          if(e.target.id === "license_amount"){
              this.doTheMath({second: parseInt(e.target.value)})
          }
      })
  }
  
  doTheMath(params){
      var one = 13;
      var two = 1;
      one = (params.first !== undefined)?params.first:one
      two = (params.second !== undefined)?params.second:two
  
      console.log(one,two)
  }
  </code></pre>
  
  <p>First is getting input from a radio button group (their ids, which are 'radio_' 13, 22 and 34), second is a select-option dropdown - an array from 1 to 10. Passing an object because variables are in separate listeners, don't want to declare null for absent parameter.</p>
  
  <ul>
  <li><p>What I expected:</p>
  
  <ul>
  <li>Defaults are 13 and 1. I select the second radio button, now the values are 22 and 1.</li>
  <li>I select, say, option 5 from dropdown, now it's 22 and 5.</li>
  <li>I switch from second radio button to first, I have 13 and 5.</li>
  </ul></li>
  <li><p>What I got:</p>
  
  <ul>
  <li>Defaults 13 and 1, I select radio-2, that makes the variables 22 and 1 respectively.</li>
  <li>Selecting option 4, I expect 22 and 4. Instead, it's 13 and 4.</li>
  <li>Changing to radio-3. 34 and 4? No, 34 and 1.</li>
  </ul></li>
  </ul>
  
  <p>Why aren't they being overwritten by the incoming arguments? Tried regular conditionals, same result.
  Thank you very much for your time, even if it's trivial.</p>