title: Keep the value of an argument after being used in a function
body: <p>I'm learning Javascript and I'm doing a little program that calculates the waiter tips based on the amount of your bill and the total you have to pay (bill + tip). This return 2 arrays, the first one with the tips by bill and the second with the total to pay.</p>
  
  <p>Here is the code:</p>
  
  <pre class="lang-js prettyprint-override"><code>var myBillsArray = [];
  var numberOfBills = parseInt(prompt('Please enter the number of bills.'));
  for(i=0; i&lt;numberOfBills; i++){
    myBillsArray[i] = parseInt(prompt(`Insert your bill number ${i+1}`));
  }
  holidayBills(myBillsArray);
  
  function holidayBills(billsArrays){
    var tipsArray =  [];
    var finalBillArray = [];  
  
    tipsArray = calculateTips(billsArrays);
    finalBillArray = calculateFinalBill(myBillsArray, tipsArray);
  
    console.log(tipsArray);
    console.log(finalBillArray);
  }
  
  function calculateTips(arrayOfBills){
    for(i=0; i&lt;arrayOfBills.length; i++){
      if(arrayOfBills[i] &lt; 50){
        arrayOfBills[i] *= 0.20;
      }else if(arrayOfBills[i] &gt;= 50 &amp;&amp; arrayOfBills[i] &lt; 200){
        arrayOfBills[i] *= 0.15;
      }else{
        arrayOfBills[i] *= 0.10;
      }
    }
    return arrayOfBills;
  }
  function calculateFinalBill(arrayOfBills, arrayOfTips){
    var finalBill = [];
    for(i=0; i&lt;arrayOfBills.length; i++){
      finalBill[i] = arrayOfBills[i] + arrayOfTips[i];
    }
    return finalBill;
  }
  </code></pre>
  
  <p><a href="https://jsfiddle.net/JonathanSosa/6ejudpv0/3/" rel="nofollow noreferrer">jsfiddle</a></p>
  
  <p>But the only issue that I'm having is that when I do the addition of the bill + tip, the bill value is the same that the tip value. I think it's a matter of scope, but I don't know where.</p>
  
  <p>If you're wondering why I'm using <code>var</code> instead of <code>let</code> it's because the exercise asks me to.</p>