This course has been updated! We now recommend you take the Deep JavaScript Foundations, v3 course.
Transcript from the "Exercise 1: Solution" Lesson
[00:00:00]
>> [MUSIC]
[00:00:04]
>> Kyle Simpson: Going back over what we talked about, the first thing that our read me tells us is we can't have any global variables at all. What was our most likely solution for preventing global variables?
>> Speaker 2: An IFFE.
>> Kyle Simpson: An IFFE. Anybody remember that? So if we were to simply put an IFFE to start our program, go to the very end of our program and finish our IFFE.
[00:00:34] And then for good measure I might indent all of this stuff, but not technically required. Now, [COUGH] everything is private. So if I were to save this code and run it, actually let me do one quick thing.
>> Kyle Simpson: Before I start making changes to this code and saving them.
[00:01:14] All right, so if I were to save this file and run it. Now I didn't actually fix my bug, but now you'll notice obviously we're on different line number, because now I've solved the problem of global variables. So my next problem is, well I know line 3 is causing a problem because it's trying to do a, and a is a variable.
[00:01:34] It's a function expression, so I said one of the things that you're legally allowed to do is change a declaration, change an expression into a declaration. So if I change that to just simply function A, we don't need the semicolon anymore. And I save my file. Now A worked, but B is broken.
[00:01:55] All right, let's look for B. What's the problem with B? B is down here, also. Listed as a function expression, rather than a function declaration. So let's change B into a function. Now, you may be tempted to change a whole bunch of these. But, again I said, in the spirit of the exercise, try to fix as little as possible.
[00:02:22] Okay, now we got, Oops, being printed, not an error. How's that happening? Well it's happening because we got our function here that's printing out, Oops, but we're not allowed to change that, see we have a variable C. Let's see if we got a different, we've got one down here.
[00:02:39] What happens if I change that into a declaration. Does anybody know how that might work? Because of hoisting, it's going to override the previous declaration. So now when I save my code, undefined, not a function, so now I'm getting a problem with The function D. Why am I getting a problem with the function D?
[00:03:04]
>> Speaker 2: [INAUDIBLE]
>> Kyle Simpson: Let me just verify here real quick. I'm trying to call D
>> Kyle Simpson: So I'm trying to call D way up here at the top, before D can actually run because D hasn't been given the value yet. So everybody see that? Does everybody see why that's true because the capital D gets his information for the function.
[00:03:43] He gets that from this line but we're trying to execute ourselves up here at the top in this line. So, I could start trying to solve all kinds of problems but I could also observe that, maybe there's a trick that I should pull about not executing my function at the beginning, like I'm doing.
[00:04:04] Okay, what if there was a way to take out this function call entirely and execute it in a different way. So, what if I was, for instance, this is just one of the possible ways to do it... I could return that A function from my ify and I could execute my A function at the end of everything.
[00:04:25] Rather than at the beginning of everything. So if I save that code, again not the only way to solve that problem, but now I've made some progress. Now I've gotten to E. E is trying to do something that they can't do, so let's go ahead and look at the function e, e's trying to call f but f is still, isn't this capital f yet.
[00:04:49] I mean, the lowercase f hasn't been given the value f yet. Let me double check myself real quick, I'm forgetting in my fixed version one of several ways that I can solve that. I remember now. So another way of solving this is to deal with the fact that the problem is that f isn't getting the value early enough.
[00:05:14] But f is the parameter name which means I could pass in the function itself. So if I came here to E, wherever E was.
>> Kyle Simpson: Who calls E, sorry. The D function. If I came here, if I passed in the F function, now he's going to get assigned before he tries to be called.
[00:05:44]
>> Kyle Simpson: All right, now G is having trouble so let's go and see what, G's having trouble because it's trying to call H. But H is a function expression so we can change H to simply be a function declaration. So we take advantage of hoisting. Okay, well now I made it all the way to k, but it just stopped, it didn't do anything else.
[00:06:06] So what happens with these k values? Well, I've got a todo statement that says I need to call the next function. So what is my call to my next function gonna look like? Well, if you were looking into this, you would see I was creating these functions from my string by saying
[00:06:26]
>> Kyle Simpson: Rest of i, so, rest of i + 1, Oops. So, if we put in that call. Now everything finishes to the end and I've got a through z. However there's still a problem, anybody know what the problem with this code is. Can't do global variables, exactly. So one way of solving this, without very much change to my code, is to create an object for those variables, for those functions to be assigned into.
[00:07:15]
>> Kyle Simpson: Let me double check, what did I do? [INAUDIBLE]
>> Speaker 2: [INAUDIBLE]
>> Kyle Simpson: You're right, absolutely, good catch. So now I need to call object.k. There we go, all right. That was the spirit of the exercise, I know it's kind of a silly one. But it was to get you to think about your hoistings.
[00:07:43] Get you thinking about how you can play with Scope. You notice a bunch of these we left as expressions, because one of our solutions called for simply executing the A at a later time.