How do I take a number from one function and use it in another function?-CodePudding

I am coding a tip calculator for my class and we need to create 3 functions. The second function needs to use the number I got in the first function, and the third function needs to use the number I got in the second function.

What I tried:

// Grab the HTML Elements you want to work with
const billTotal = document.querySelector("#billTotal");
const tipPercent = document.querySelector("#tipPercent");
const noPeople = document.querySelector("#noPeople");
const calcTip = document.querySelector("#calcTip");
const resultsDiv = document.querySelector("#resultsDiv");


// Add event Listeners for your elements
calcTip.addEventListener("click", function() {
  getTipAmount();
  getBillTotal();
});

// Declare any functions you will need 

function getTipAmount() {
  let total = Number(billTotal.value);
  let tip = Number(tipPercent.value);
  let output = total * (tip / 100);
  let tipAmount = output.toFixed(2);
  console.log(tipAmount);
}

function getBillTotal() {
  let billAmount = Number(billTotal.value);
  let billTotalur = tipAmount   billAmount;
  let billTotalr = billTotalur.toFixed(2);
  console.log(billTotalr)
}

function amountPerPerson() {

}

I was expecting the tipAmount to be added to billAmount but I receive tipAmount is not defined.

CodePudding user response：

You need to add a return statement to store this in a higher scope variable to then pass it to the next function :

// Grab the HTML Elements you want to work with
const billTotal = document.querySelector("#billTotal");
const tipPercent = document.querySelector("#tipPercent");
const noPeople = document.querySelector("#noPeople");
const calcTip = document.querySelector("#calcTip");
const resultsDiv = document.querySelector("#resultsDiv");


// Add event Listeners for your elements
calcTip.addEventListener("click", function() {
  const tipAmount = getTipAmount();
  const billTotalr = getBillTotal(tipAmount);

  console.log(tipAmount);
  console.log(billTotalr)
});

// Declare any functions you will need 

function getTipAmount () {
  const total = Number(billTotal.value);
  const tip = Number(tipPercent.value);
  const output = total * (tip / 100);
  const tipAmount = output.toFixed(2);

  return tipAmount  
}

function getBillTotal (tipAmount) {
  const billAmount = Number(billTotal.value);
  const billTotalur = tipAmount   billAmount;
  const billTotalr = billTotalur.toFixed(2);
  
  return billTotalr
}

function amountPerPerson() {

}

CodePudding user response：

This is one way of feeding the result from one function into another function. There are many ways of writing functions in JavaScript but this is one of the most basic ways of doing it.

function func1() {
  return 'Hello';
}

function func2(string) {
  return string   ' world';
}

const result1 = func1();

const result2 = func2(result1);

console.log(result2);