Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Loops Working with 'for' Loops The Refactor Challenge – Duplicate Code

Posted by Occhipinti Giuseppe
Occhipinti Giuseppe
7,719 Points

Arrow function invoked as arguments without parenthesis?

when the loop is executed there is the function "randomRGB()" that as argument has the arrow function "randomValue" which is invoked there, right? why the arrow function used as an arguments is invoked without parethesis?

Then everything is started from the loop right?

Thank you in advance for everyone that takes the time to reply.

3 Answers

Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

The function "randomValue" is not being invoked in the loop where it is passed as an argument to "randomRGB". But inside "randomRGB" it gets a new name and becomes "value" and is invoked 3 times:

function randomRGB(value) {
  const color = `rgb( ${value()}, ${value()}, ${value()} )`; // <- "value()" invokes function
  return color;
}
Occhipinti Giuseppe
Occhipinti Giuseppe
7,719 Points
Occhipinti Giuseppe
Occhipinti Giuseppe
7,719 Points

Thank you so much Steven, now I got it! I want to write below the steps in case somebody else might have the same troubles:

  1. A function can be assigned to a variable, (not necessarily a function expression)
  2. when assigning the function to a variable do not use the parentheses - infact we are referencing/pointing to the function,
  3. now the function can be invoked through the name of the variable (which is pointing to the function)
  4. to invoke the function through the variable name you MUST use the two parentheses.

example:

1 - creation of a function named "bees".

function bees() { window.alert("Thank you Steven"); }

2 - declaration of a variable named "honey" and assignment of the function named "bees" to the latter; NO parentheses to assign the function

var honey = bees;

3 - calling the function through the variable named "honey"

honey(); // message on the window alert: Thank you Steven

Thank you

Giuseppe

...

Occhipinti Giuseppe
Occhipinti Giuseppe
7,719 Points
Occhipinti Giuseppe
Occhipinti Giuseppe
7,719 Points

so the key should be - parents invoke each "value"... but still is unclear to me, sorry! Maybe due to my lack of functions knowledge so far.

Could you Steven or anyone explain a bit further this "parents invoke..." concept? and then it would be great to know what JavaScript engine does from top to bottom.

I mean though the arrow function is on line 2 at the top but still is not executed, am I mistaken?

Thank you again for your kindness

Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

Sorry for any confusion, I had used "parens" (not "parents") as an abbreviation for "parentheses", but I rephrased my answer.

And the arrow function is invoked 3 times inside "randomRGB", where it has the parameter name "value".