Https://www.codecademy.com/paths/web-development/tracks/web-dev-js-arrays-loops-objects/modules/learn-javascript-iterators/lessons/higher-order-functions/exercises/functions-as-parameters

https://www.codecademy.com/paths/web-development/tracks/web-dev-js-arrays-loops-objects/modules/learn-javascript-iterators/lessons/higher-order-functions/exercises/functions-as-parameters

Hello.

I’ve been stuck at the chapter of “HIGHER-ORDER FUNCTIONS” for 2 days so far, and only today started or just seem to understand a little bit of it. So I wrote these two functions:

let a = function(width, height) {
  let area = width * height;
  console.log(area);
}

let b = function(anotherFunc) {
  console.log('I\'m running another function below:')
    anotherFunc();
}

b(a(5, 5));

The output shows the following:

25
I'm running another function below:
/home/ccuser/workspace/higher-order-functions-functions-as-data/app.js:8
    anotherFunc();
    ^

TypeError: anotherFunc is not a function...

My questions are:

  1. Am I close to understanding this topic judging by my code?
  2. Since it throws error, there is something apparently that I’m not doing right. What I was expecting in output: first) it writes I’m running another function below: and below it shows the answer for the provided arguments, and here it is 25.

Thank you in advance whoever can help me with this.

Hi there, welcome back to the forums!

Yeah, I’d say so.

Think about what the statement b(a(5, 5)) is actually doing.

If you'd like a hint, click me!

If I modify your program by one line,

let a = function(width, height) {
  let area = width * height;
  console.log(area);
}

let b = function(anotherFunc) {
  console.log('I\'m running another function below:')
  console.log(`The value of parameter 'anotherFunc' is ${anotherFunc}`);
  anotherFunc();
}

b(a(5, 5));

the output changes to:

25
I'm running another function below:
The value of parameter 'anotherFunc' is undefined
TypeError: anotherFunc is not a function

Can you see from this why it isn’t working as you intended?

1 Like

Thank you for answering. I am still not sure. Can you check this piece of code? Am I getting closer to the right path or going backwards? :slight_smile:

let a = function(width, height) {
  let area = width * height;
  console.log(area);
}

let b = function(a, number) {
  let mult = number * number;
  console.log(`Above I multiplied the second parameter of this function and got the answer of ${mult}.`)
  console.log('Below I returned the answer of another function by giving the arguments to that function:')
    a(5, 5);
}

b(a, 10);

No problem. :slight_smile:

I’d say you’re at about the same place; you’ve got closer in some ways, but further away in others.

The idea of being able to pass a function as a parameter is to use that function in a dynamic way inside of another function block of code. Your revised code has a hard-coded function call - a(5, 5) - which is not what we’re trying to do. :slight_smile:

Perhaps I should explain why I modified your program like I did in my previous post:

let a = function(width, height) {
  let area = width * height;
  console.log(area);
}

let b = function(anotherFunc) {
  console.log('I\'m running another function below:')
  console.log(`The value of parameter 'anotherFunc' is ${anotherFunc}`);
  anotherFunc();
}

b(a(5, 5));

As I said in the previous post, this program produces the following output in the console:

25
I'm running another function below:
The value of parameter 'anotherFunc' is undefined
TypeError: anotherFunc is not a function

The line which I added is this one:

  console.log(`The value of parameter 'anotherFunc' is ${anotherFunc}`);

As you can see, when JavaScript gets to this point in the script the anotherFunc parameter of your function b has a value of undefined. “Why is this?”, you may ask, since you’ve called your function b with a parameter of a(5,5).

The reason your parameter has a value of undefined is because JavaScript immediately evaluates your function call of a(5, 5). This is why we see the output of 25 on the first line of the console, as we would expect if we just called a(5, 5).

Whenever a function ends it’s execution in JavaScript, it hands back a value to wherever it was called from. In your function definition, you tell JavaScript what you want to hand back using the return keyword - but if your function does not have a return statement, JavaScript will return a value of undefined by default.

Your function a does not have a return statement, so when it runs it logs the area to the console (as expected) but defaults to returning undefined, and so because we’ve called the function a as a parameter of the function b the return value from a gets passed as the parameter for b. undefined is not a function, and this is why your original attempt resulted in the TypeError: anotherFunc is not a function.


The key aspect that you’re overlooking, which I think is preventing you from getting this right, is that functions are objects in JavaScript:

function doSomeMath(num1, num2) {
  let add = num1 + num2;
  let sub = num1 - num2;
  let mul = num1 * num2;
  let div = num1 / num2;

  console.log(`
  ${num1} + ${num2} = ${add}\n
  ${num1} - ${num2} = ${sub}\n
  ${num1} x ${num2} = ${mul}\n
  ${num1} / ${num2} = ${div}\n`);

  return [add,sub,mul,div];
}

console.log(doSomeMath);      // here we log the function object - note the lack of parentheses!
console.log(doSomeMath(2,4)); // here we log the return value of calling the function.

When you pass a function to another function as a parameter, if you pass the function identifier - which in my example here is doSomeMath - then the function object is passed as the parameter. Passing the function with it’s own parameters - like you did with b(a(5, 5)) - results in the inner function being evaluated, and it’s return being used as the parameter.

Does that make sense, or help any? :slight_smile: