Learn About Functional Programming. Need clarification

Hi everybody, can anyone clear up this basic thing for me please? I know this sounds like an elementary question but I don’t want to leave this unclarified in case it will come back to bite me in more advanced situations.

Below you will see two almost Identical snippets of code, the first one is the correct answer for the task at hand, the other one is almost exactly the same but omits the line const teaCup = prepareTea(); and pushes prepareTea instead. As a result, the first one gives the correct answer, which is greenTea printed 40 times, the other one prints prepareTea 40 times. Why should we assign prepareTea to a local variable within a function in order to operate correctly?


/**
 * A long process to prepare tea.
 * @return {string} A cup of tea.
 **/
const prepareTea = () => 'greenTea';

/**
 * Get given number of cups of tea.
 * @param {number} numOfCups Number of required cups of tea.
 * @return {Array<string>} Given amount of tea cups.
 **/
const getTea = (numOfCups) => {
  const teaCups = [];
  
  for(let cups = 1; cups <= numOfCups; cups += 1) {
    const teaCup = prepareTea();
    teaCups.push(teaCup);
  }

  return teaCups;
};

// Add your code below this line

const tea4TeamFCC = getTea(40); // :(

// Add your code above this line

console.log(tea4TeamFCC);


/**
 * A long process to prepare tea.
 * @return {string} A cup of tea.
 **/
const prepareTea = () => 'greenTea';

/**
 * Get given number of cups of tea.
 * @param {number} numOfCups Number of required cups of tea.
 * @return {Array<string>} Given amount of tea cups.
 **/
const getTea = (numOfCups) => {
  const teaCups = [];
  
  for(let cups = 1; cups <= numOfCups; cups += 1) {
    teaCups.push(prepareTea);
  }

  return teaCups;
};

// Add your code below this line

const tea4TeamFCC = getTea(40); // :(

// Add your code above this line

console.log(tea4TeamFCC);

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming

In your second snippet you are printing a function because you are not calling the function when you pass it as a parameter to the push() method, try this instead teaCups.push(prepareTea()) and check the console, you should see whatever value that function is returning, in this case it’s green tea.

basically , teaCups.push(prepareTea); means take the content of prepareTea (which is a function) and push it to the array teaCups .
whilst

    const teaCup = prepareTea();
    teaCups.push(teaCup);

means put the return value of prepareTea() (which is ‘greenTea’) in teaCup and then push this same variable to the teaCups array .

alternatively you can just do this : teaCups.push(prepareTea()); it’s the same thing , minus a variable LOL .
hope it’s clear :smiley:

Yes! Thank you very much, now it’s clear. The difference was between passing the function itself and running the function and passing its result. The set of brackets after prepareTea did the trick and now the issue is cleared, thank you once again!

be careful about not using const on a variable that you indent to modify later. use 'let instead

References are never modified for any of the const declarations in code there (it would break otherwise). const means “this variable can never be reassigned in this scope”, and nothing in that code is.

1 Like