Help me to understand javascript closure

OK, I see. I used an anonymous function - you’ve created a named one. That can work too.

I see two issues. First, You are calling the function. Do we want to call it? What did we say we need to do in the outer function? We need to return a function. The other (minor) issue is that that is a bad name for the inner function - it is not specific to Paul.

thats the important part that i need to understand…how can i call ‘Paul’.

if i console log greeting the output is: ‘hello’ ‘by’ ‘hi’, and i can access this through the greeting parameter…but how about paul or john?

could be:

function greet(greeting) {
    return function(greetWithHello) {
        return greeting + greetWithHello
    }
}

Sure, that looks good. You could still have the inner function named:

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

That should work.

how can i call ‘Paul’.

You don’t.

When in doubt, put in log statements.

function greet(greeting) {
  console.log('inside greet, with', greeting)
  function addName(name) {
    console.log('inside addName, with', greeting, 'and', name)
    return greeting + name
  }
  console.log('returning inner function addName', addName)
  return addName
}

console.log('about to begin')
const greetWithHowdy = greet('Howdy')
console.log('greetWithHowdy', greetWithHowdy)
const daveHowdyGreeting = greetWithHowdy('Dave')
console.log(daveHowdyGreeting)

Look at those log statements and work through it.

How does the inner function “remember” what greeting is? Closure.

1 Like

that was the best explaining closue that i ever seen. thank you!

1 Like

Closure is happening all the time in JS. It’s just one of those things that when I try to understand it it seems more complicated than it is. It is a weird subject.

yes, its incredible when you meet closure for the first time…but i will make more practice on this, is extremely useful!

1 Like

Really, this is an example of currying function that uses closure. It is currying because instead of writing a function that took two arguments:

greet('Howdy', 'Dave')

we wrote one that took the first argument and returned a function that took the second argument, so it gets used like:

greet('Howdy')('Dave')

That is currying, but it uses closure internally.

I assume you worked out your string construction problem.

1 Like

yes now i have correctly what i want to output, now i need to understand how can work with more complex rules, for example:

Implement the createStore function which creates an empty array of products and adds a closure that deals with adding products to the store. For each product added to the store run the console.log of the entire store

function createStore() {

}

const redPants = {id: 1, name: 'Red Pants'};
const whiteHat = {id: 2, name: 'White Hat'};
const blackSneakers = {id: 3, name: 'Black Sneakers'};

console.log('--- Dress Store ---');
const dressStore = createStore();
dressStore(redPants);
dressStore(whiteHat)

console.log('--- Shoes Store ---');
const shoesStore = createStore();
shoesStore(blackSneakers);

Go ahead and start a new thread for this so we can keep things cleaner. Plus, others may want to join the party. I’m going to have to go do some business but I can take a look when I get back.

1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.