Why is it saying that calcAverage is not a function, when it is-CodePudding

I created a simple function to calcluate the average of 3 numbers:

let calcAverage = (v1,v2,v3) =>{

calcAverage = v1 v2 v3 / 3;

return calcAverage
}

const d1 = calcAverage(44, 23,71)
const k1 = calcAverage(44, 23,71)
console.log(d1)

if you comment out: const k1 = calcAverage(44, 23,71)then you will notice that the const d1 = calcAverage(44, 23,71)works, but why does it say 'Uncaught TypeError: calcAverage is not a function for this line of code: const k1 = calcAverage(44, 23,71)? this doesn't make any sense to me. how do I make both of them work? and why is it even saying that calcAverage is not a function i the first place?

CodePudding user response：

Because you reassigned calcAverage in this line

calcAverage = v1 v2 v3 / 3;

which made calcAverage a number value instead of a function

why don't you just return this calculations immediately

return v1 v2 v3 / 3;

CodePudding user response：

When calling calcAverage for the first time, it indeed is a function. However, you overwrite it within the function itself to be a number:

calcAverage = v1 v2 v3 / 3;

Simply change the variable name inside the function to make it work as you expect:

const calcAverage = (v1,v2,v3) =>{

    const result = v1 v2 v3 / 3; 

    return result;
}

const d1 = calcAverage(44, 23,71);
const k1 = calcAverage(44, 23,71);
console.log(d1);

Update:

To clearly see the issue, you can log out the type of calcAverage for each of the function calls:

let calcAverage = (v1,v2,v3) =>{
  calcAverage = v1 v2 v3 / 3; 
  return calcAverage;
}
    
console.log("Type before first call: ", typeof calcAverage);
const d1 = calcAverage(44, 23,71);
console.log("Type before second call: ", typeof calcAverage);
const k1 = calcAverage(44, 23,71);

This nicely shows the advantage of using const over using let for actual constants, by the way. If you would have declared calcAverage as a const, you wouldn't have run into this issue.

CodePudding user response：

Solution to this problem is use a different variable name to hold the calculated value inside the calcAverage arrow function.

let calcAverage = (v1,v2,v3) =>{

   let calcValue = (v1 v2 v3) / 3;
   // it is recommended you bracket your numerator so as not to confuse the calcuation
   // because leaving it as v1 v2 v3 / 3 will solve the maths as v1 v2 (v3/3)

   return calcValue;
}

const d1 = calcAverage(44, 23,71);
const k1 = calcAverage(44, 23,71);
console.log(d1)

As for me, i did suggest you use const when declaring an arrow function. It helps to make the function unmanipulatable