2 Replies - 136 Views - Last Post: 04 June 2018 - 02:46 PM

#1 kayut   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 36
  • Joined: 20-January 17

Trying to understand closures

Posted 04 June 2018 - 01:47 PM

Hey,

If I use a closure inside an IIFE like this:

var outerFunction = (function() {            // this is an IIFE
  const outer = `I'm the outer function!`;

  var innerFunction = function() {
    const inner = `I'm the inner function!`;
    console.log(outer); // I'm a variable from the outer function!
  }

  return {
	kir:innerFunction
	} 
})();


It seems to me that the IIFE returns an object called outerFunction and add the method kir to it.
So that now, I can access the kir method of the object outerFunction with the following code:
outerFunction.kir();


But if I don't use an IIFE for the same example:

function outerFunction () {
  const outer = `I'm the outer function!`;

  var innerFunction = function() { 
    const inner = `I'm the inner function!`;
    console.log(outer); // I'm the variable from the outer function!
  }

  return {			
	kir:innerFunction
	} 
}


I can access the method kir only if I run this:
outerFunction().kir();


Why it doesn't work if I run this?:
outerFunction();
outerFunction.kir();



It seems to me that in the first example, when the IIFE runs automatically, it returns the object outerFunction and add the method kir to it.
But when I run outerFunction manually, it's different and I can't access the method kir.

I'm a bit confused!
Can some one please explain to me why I can't access kir method in the second example by running this?:
outerFunction();
outerFunction.kir();



I guess this is more a question about understanding IIFE rather than the closure.

Thanks

This post has been edited by kayut: 04 June 2018 - 01:48 PM


Is This A Good Question/Topic? 0
  • +

Replies To: Trying to understand closures

#2 ArtificialSoldier   User is offline

  • D.I.C Lover
  • member icon

Reputation: 2031
  • View blog
  • Posts: 6,202
  • Joined: 15-January 14

Re: Trying to understand closures

Posted 04 June 2018 - 02:43 PM

It doesn't work like that because you're not doing anything with the object the function returns. You could.

var obj = outerFunction();
obj.kir();

Was This Post Helpful? 0
  • +
  • -

#3 sepp2k   User is offline

  • D.I.C Lover
  • member icon

Reputation: 2620
  • View blog
  • Posts: 4,175
  • Joined: 21-June 11

Re: Trying to understand closures

Posted 04 June 2018 - 02:46 PM

In your first code, the IIFE returns the object { kir:innerFunction }. So now the variable outerFunction refers to that object. Note that despite its name, outerFunction is not a function. It's { kir:innerFunction }, which is an object with a member named kir.

In your second code, outerFunction is a function. When you call that function, it returns the { kir:innerFunction }. So you can access the kir member of outerFunction's return value, but that doesn't mean that outerFunction somehow turns into its own return value.

Like if you did var obj = outerFunction();, you could now access obj.kir, but you can't do outerFunction.kir because outerFunction is not an object with such a member and calling it does not change that.
Was This Post Helpful? 2
  • +
  • -

Page 1 of 1