'javascript sum values from two different functions

I'm trying to create a calculator, I've managed to get the values from a google Sheets doc when I console.log from within the function. I'm now trying to combine those figures to get a total price. I'm getting a NAN error.

I'm new to Javascript so I could be missing something simple but I have tried and tried and I can't figure it out.

I simply want to add the hourly rate and the mileage together to get 25.00 and then convert it to a UK currency.

      function showHourlyRate(qty) {
        var oneFunc = qty
        console.log(oneFunc) //result is 5.00
        return oneFunc
      };

      function showMileageRate(qty) {
        var twoFunc = qty
        console.log(twoFunc) //result is 20.00 
        return twoFunc
      };

      function combinedTotal(){
        var addTogether = showHourlyRate() + showMileageRate();
        alert(addTogether); // gives NAN
        return addTogether;
      }

UPDATE:

Excuse me if my terminology is not correct.

I've updated my question as the answers still didn't work for me which make me think I've done something early on so...

This is a google apps script.

I have a functions.gs, within this file I get the spreadsheet and sheet needed. I then get the range of columns and filter the results to match my word. Once it finds a match, get the next column which has a price. I then return that.

Here's that part: (I've only added the hourly rate one as the mileage one is the same but with the names changed)

function getHourlyRate() {
  const sheet = SpreadsheetApp.openById("17iaOdOS9N09tFb38w4P9GC8furzy33sXVnQK8dIhPnI").getSheetByName("Working Hours");
  const data = sheet.getRange(2, 1, sheet.getLastRow()-1, 8).getValues();
  const filteredData = data.filter(r => r[0] === "Sundries");

  return filteredData.length === 0 ? "No Match" : filteredData.reduce((subtotal, r) => subtotal + r[1], 0).toFixed(2);
  
}

My next file is the index.html. I first load the function on initial load, I then get the hourly rate using the function afterSidebar Loads which then uses the showHourlyRate function.

Thats how I get my 20.00 or 5.00 figure

here's the html file:

      var arrayOfArrays;

      function afterSidebarLoads() {
        google.script.run.withSuccessHandler(showHourlyRate).getHourlyRate(); 
        google.script.run.withSuccessHandler(showMileageRate).getMileageRate(); 

      document.addEventListener("DOMContentLoaded", afterSidebarLoads);
        
      }

      function showHourlyRate(qty) {
        var oneFunc = hourlyRate
        // var ghjJhg = oneFunc.toFixed(2)
        // console.log(oneFunc) //result is 0.55
        return oneFunc
      };

      function showMileageRate(mileageRate) {
        var twoFunc = mileageRate
        // var ghjJhg = oneFunc.toFixed(2)
        // console.log(twoFunc) //result is 22.64 
        return twoFunc
      };

      function combinedTotal(){
      }

I hope this makes more sense and thank you all for answering.

UPDATE 2:

So it turns out that the following code works in the functions.gs file but not in the index.html file

function combinedTotal(){
        var addTogether = Number(getHourlyRate()) + Number(getMileageRate());
        console.log(addTogether);
        return addTogether;
      }

I changed the functions names to match the ones in the functions.gs file.

What am I not understanding?



Solution 1:[1]

      function showHourlyRate(showHourlyRate) {
            // ... do some more logic if needed
            return showHourlyRate
      };
    
      function showMileageRate(showMileageRate) {
            // ... do some more logic if needed
            return showMileageRate
      };
    
      function combinedTotal(hourlyRate,mileageRate){
            // ... do some more logic if needed
            return showHourlyRate(hourlyRate) + showMileageRate(mileageRate);
      }
          
      console.log(combinedTotal(5,20))

Solution 2:[2]

You need to add the params to the called functions on the 3rd function after if you are getting a NaN error probably because you are using strings or other type of value from the doc, you cloud use something like this

function showHourlyRate(qty) {
  return parseFloat(qty)
};

function showMileageRate(qty) {
  return parseFloat(qty)
};

function combinedTotal(hourlyRate, mileageRate){
  let addTogether = showHourlyRate(hourlyRate) + showMileageRate(mileageRate);
    console.log(addTogether)
  return addTogether;
}

combinedTotal(1,"22")

Solution 3:[3]

You didn't specify the inputs for your showHourlyRate and showMileageRage functions.

You put:

function combinedTotal(){
    var addTogether = showHourlyRate() + showMileageRate();
    alert(addTogether); // gives NAN
    return addTogether;
}

You can have:

function combinedTotal(hourlyRate, mileageRate){
    var addTogether = showHourlyRate(hourlyRate) + showMileageRate(mileageRate);
    alert(addTogether); 
    return addTogether;
}

Solution 4:[4]

You could try to use the "Number" method to convert the variables to numbers:

function combinedTotal(){
        var addTogether = Number(showHourlyRate()) + Number(showMileageRate());
        alert(addTogether);
        return addTogether;
      }

The Nan message seems to pop up when the number is not a legal number, reference this.

Solution 5:[5]

This is NOT the answer you seek but your issues are too large to put in as a bunch of comments so I commented the code presented in the question:

// you never pass this any value in qty
// this does nothing so it is the same as: return qty;
function showHourlyRate(qty) {
    var oneFunc = qty
    console.log(oneFunc) //result is 5.00
    return oneFunc
  };
   // you never pass this any value
  function showMileageRate(qty) {
    var twoFunc = qty
    console.log(twoFunc) //result is 20.00 
    return twoFunc
  };

  // you never pass values to your functions so no number is returned
  // This is the same as 
  // var addTogether = undefined + undefined;
  function combinedTotal(){
    var addTogether = showHourlyRate() + showMileageRate();
    alert(addTogether); // gives NAN
    return addTogether;
  }

console.log("What:", undefined + undefined); // NaN

function getHourlyRate() {
  const sheet = SpreadsheetApp
    .openById("17iaOdOS9N09tFb38w4P9GC8furzy33sXVnQK8dIhPnI")
    .getSheetByName("Working Hours");
  const data = sheet
    .getRange(2, 1, sheet.getLastRow() - 1, 8)
    .getValues();
  const filteredData = data.filter(r => r[0] === "Sundries");
  // get into a habit of positive rather than negative conditions
  //let hasNoMatch = filteredData.length === 0;
  // force a boolean on length
  let hasMatch = !!filteredData.length;
  let fixedReduce = filteredData.reduce((subtotal, r) => subtotal + r[1], 0)
    .toFixed(2);

  // return hasNoMatch ? "No Match" : fixedReduce;
  return hasMatch ? fixedReduce : "No Match";
}

// never used, commented it out
// var arrayOfArrays;

function afterSidebarLoads() {
  // you seem to want to call the function?? how you don't consume the return is odd
  // you show it before you GET it? odd that these do that
  google.script.run.withSuccessHandler(showHourlyRate).getHourlyRate();
  google.script.run.withSuccessHandler(showMileageRate).getMileageRate();
  // you call THIS "afterSidebarLoads" function by adding another event handler that calls this function?
  /// makes no sense to add an event handler inside the function the event handler uses
  document.addEventListener("DOMContentLoaded", afterSidebarLoads);

}
// this passes in "qty" but never uses it? 
// as it stands "hourlyRate" is undefined
function showHourlyRate(qty) {
  var oneFunc = hourlyRate
  // var ghjJhg = oneFunc.toFixed(2)
  // console.log(oneFunc) //result is 0.55
  return oneFunc
};
// you just return what was passed in after assigning it to a variable?
// get into a habit of putting semi-colons on Example:
//  var twoFunc = mileageRate;
function showMileageRate(mileageRate) {
  var twoFunc = mileageRate
  // var ghjJhg = oneFunc.toFixed(2)
  // console.log(twoFunc) //result is 22.64 
  return twoFunc
};

// does nothing and is not called here
function combinedTotal() {}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Kevin Dias
Solution 2 Carlos Gutierrez
Solution 3
Solution 4 Gabriel Carballo
Solution 5