Help me to understand javascript closure

hi, i need to solve this exercise, can someone help me to understand with code and comments?

function greet(greeting) {

}

const greetWithHello = greet('Hello');
const greetWithBye = greet('Bye');
const greetWithHi = greet('Hi');

const greetPaulWithHello = greetWithHello('Paul');
const greetPaulWithHi = greetWithHi('Paul');
const greetJohnWithBye = greetWithBye('John');
const greetSimonWithHello = greetWithHello('Simon');

console.log(greetPaulWithHello);
console.log(greetPaulWithHi);
console.log(greetJohnWithBye);
console.log(greetSimonWithHello);

/*
output

const greetPaulWithHello = greetWithHello('Paul'); // Hello, Paul
const greetPaulWithHi = greetWithHi('Paul'); // Hi, Paul
const greetJohnWithBye = greetWithBye('John'); // Bye, John
const greetSimonWithHello = greetWithHello('Simon'); // Hello, Simon

*/

Is this a closure issue?

What I see is that you have a function called greet. It takes in a salutation. It returns something. Since that something is then called as a function (with a name) that returns a string, that means that greet is a function that returns a function that returns a string. To me, that sounds like currying.

the exercise says literally: Implement the greet function which takes a greeting as an argument and asks for a closure that takes care of greeting

“asks for a close…”

What is a “close”?

Can you cut and paste the exact instructions?

Look, with what I’m thinking, closure is involved - closure is happening all the time in JS, it’s just to me, it’s not the overall issue.

yes sorry i’m italian, is closure!

OK, cool. I mean, closure is involved. My analysis is still valid, I think. Did you understand what I explained.

not really, can you provide a commented example based on that code? i need to visually see how it works to understand better (with comments if possible)

Yeah, I just solved it with what I was saying. Yeah, there is closure happening - it just wasn’t some weird case so I wasn’t really thinking about that.

Can you understand what is happening in this code?

function startAdd(add1) {
 return function(add2) {
   return add1 + add2
 }
}

const finishAdd = startAdd(1)
const solution1 = finishAdd(2)
console.log(solution1) // 3

const solution2 = startAdd(3)(4)
console.log(solution2) // 7

the function startAdd(add1) return a function with add2 as a parameter. but i do not understand how add1 and add2 are populated

const finishAdd = startAdd(1)
const solution1 = finishAdd(2)
console.log(solution1) // 3

The outer function gets called here:

const finishAdd = startAdd(1)

The value 1 gets stored in the variable add1. It is passed into the returned function, wrapped in closure. That new anonymous function is returned and stored in finishAdd.

We then call finishAdd with the value of 2. It adds those two values and returns the sum.

The second example just skips the middle man of storing the function.

ok now is more clear, but my example is a little bit different, because i have greetings defined as a string…how works that?

Well, that is what you need to figure out. Instead of adding numbers, you need to build a string. But that is really the only difference.

What I did above falls under the category of “currying” if you want to research it more.

1 Like

keep trying but i can’t find a solution :face_exhaling:

Show what you have, then we can help.

stucked here:

function greet(greeting) {
    function paulHello(name) {
        return greeting + name
    } paulHello()
}

const greetWithHello = greet('Hello');
const greetWithBye = greet('Bye');
const greetWithHi = greet('Hi');

const greetPaulWithHello = greetWithHello('Paul');
const greetPaulWithHi = greetWithHi('Paul');
const greetJohnWithBye = greetWithBye('John');
const greetSimonWithHello = greetWithHello('Simon');

console.log(greetPaulWithHello);
console.log(greetPaulWithHi);
console.log(greetJohnWithBye);
console.log(greetSimonWithHello);

OK, you have the basic idea. That is giving you the final string of “HelloPaul”. Is that the string you were supposed to build? Do you understand how to build strings? How to concatenate?

actually this return an error. so doesn’t work… my output should be

const greetPaulWithHello = greetWithHello('Paul'); // Hello, Paul
const greetPaulWithHi = greetWithHi('Paul'); // Hi, Paul
const greetJohnWithBye = greetWithBye('John'); // Bye, John
const greetSimonWithHello = greetWithHello('Simon'); // Hello, Simon

Sorry, I wasn’t looking closely enough:

function greet(greeting) {
    function paulHello(name) {
        return greeting + name
    } paulHello()
}

What is happening on that 4th line there? What is paulHello()?

i’m calling the inner function