This course has been updated! We now recommend you take the Deep JavaScript Foundations, v3 course.
Transcript from the "IIFE Pattern Questions" Lesson
[00:00:00]
>> [MUSIC]
[00:00:04]
>> Kyle Simpson: Remember we talked about functions being an early unit of scope, it turns out that as of ES6, we're getting this exciting new thing called Block Scope, and it's coming to us via a new keyword called let. Let is gonna be a cousin to the var keyword, okay?
[00:00:18] So just like we can do var a equals 2, we can do let a equals 2. And when we use the let keyword, it will implicitly hijack the scope of whichever block we happen to be in, and it will add that variable to that block rather than to the enclosing function.
[00:00:34] Question.
>> Speaker 2: There's a question from Derek W. Is there any difference if you put the invoking parentheses inside or outside the expression parenthesis?
>> Kyle Simpson: Good question. Especially since a lot of people like to follow Doug. The question, Doug Crockford, the question here is line three. I could have written, and this is one where I'm gonna have to use the arrows, so you might wanna pan to this camera.
[00:00:54] But, on line three I could have had this parenthesis, you see how I have the parenthesis around the function, and then I execute the function? I could have instead taken that parenthesis right there on line eight and moved it to the outside so that there was an execution inside, and just a non functioning outer wrapper parenthesis pair.
[00:01:15] And that actually, that second format is argued for by Doug Crockford, and this, obviously, is my preferred form. I'll just give you the two ways of thinking about it and you decide which one you like. They are functionally basically equivalent. There are a couple, I just saw a blog post the other day where there's a couple of weird cases that if you leave off semi-colons, this pattern is more robust than Doug Crockford's pattern, but they're functionally basically the same.
[00:01:45] Here's the stylistic reason why you choose one or the other. Doug Crockford, pardon my French here. But Doug Crockford calls this hanging paren, actually more appropriate than, let me go back to slide 23. He calls this hanging pair of parenthesis that hangs outside donkey balls. Kind of like those people that drive around with the trucks and those things hanging off the back.
[00:02:03] He doesn't like the look of it. He doesn't like the parenthesis sitting on the outside. He likes to put them on the inside, okay. That's why he stylistically says you should do that. Really, actually, the truth is the reason why he doesn't want to do that is because the fact that we have to wrap our function in a parenthesis is kind of annoying.
[00:02:22] Grammatically speaking, it might be nice that we could just declare a function and at the end of the declaration just put a parenthesis pair. Just execute the declaration right away. That would be nice if we could grammatically do that but that's not possible with the way the JavaScript grammar works.
[00:02:37] And so we have to put the wrapping pair of parenthesis on there, just to get around that grammatical problem. And so he says if we have to put the parenthesis pair on there to get around the grammatical problem, why not put them on the outside, rather than leaving the donkey balls hanging out?
[00:02:51] So that's, I'll get to the question in just a moment. That's the reasoning that Doug Crockford uses. Doug Crockford, in brief. Doug Crockford's reasoning for this style choice is that, we only have to put the parenthesis there as a nod to grammar. Theoretically, we would want just the open close parenthesis in the end without the wrapping parentheses, but we can't grammatically.
[00:03:13] So if we have to put a wrapping parentheses there, let's make it on the outside rather than this weird donkey ball style. Okay, so that's his reasoning, it's a valid stylistic choice. I don't agree with it, but it's a valid stylistic choice. Here's my reasoning for why I like this better.
[00:03:26] Because I actually like the fact, as I kinda referenced earlier, I kinda like the fact that this is a nod to Lispy syntax. To me, this is clear that I'm putting a function, a function value, on to my expression stack by wrapping it in a parenthesis, and then I'm immediately executing the value on my expression stack.
[00:03:44] And we do that in other places without functions, so I like the fact that this sort of in a least sense as treating a function as any old value that we can deal with. So that's my preference for why I like this style, these are just stylistic choices and not functional once.
[00:03:58] I hope that clarifies the questions on this string.
>> Speaker 3: Don't we need to give a name to that function or something.
>> Kyle Simpson: We are [INAUDIBLE] functions questions. They said we ought to name it IIFE or whatever.
>> Speaker 3: Okay.
>> Kyle Simpson: Just to be short. The idiomatic way is everybody does an autonomous IIFE, and I just think we ought to do named IIFE, so.