JavaScript: The Hard Parts Global Execution Context

Transcript from the "Global Execution Context" Lesson

[00:00:00]
>> Will Sentance: So we start off with the underlying principles that will let the hard parts follow. These tools, we're already seeing them, the execution of our code playing out. All the tools that will let all those complex pieces to come work more naturally. So we asked, what happens when JavaScript executes, that is runs, our code?

[00:00:21] Let's mix it up. Mohammed, what happens when JavaScript is just doing our code? It's like we write the code anywhere. We can write it on a paper napkin. But then we've gotta run it somewhere that does something with the code. What does it do? What are the two basic things it does, Mohammed?

[00:00:38]
>> Mohammed: It processes it line by line?
>> Will Sentance: Line by line. It takes line 1, it says, do it! Now actually, it traditionally was done as an interpreted language, which means line by line. Now it uses what's called just in time compilation, at least in the Chrome JavaScript runtime.

[00:00:57] But it is essentially, yes, taking line 1, then line 2, then line 3, yep. And what else does it do, Muhammad?
>> Mohammed: It creates memory of variables.
>> Will Sentance: It creates, yes, right. It assigns data to labels, known as variables or consts, or whatever, in memory and makes those available by them, and the data available by the name.

[00:01:18] Okay, so we, ourselves, can understand all of JavaScript if we do that process. If we ourselves go through and store the data, go through and run the code, line by line, we can understand all of JavaScript. So let's do it, let's do it line by line. Let's start with Barb.

[00:01:39] Barb, what are we doing with the very first line of code here?
>> Barb: Store 3 and the num variable?
>> Will Sentance: Yeah, exactly. There it is, num is initialized to 3. Excellent, good job, Barb, very nice. Clara, next line of code, what's happening?
>> Clara: So creating the name MultiplyBy2 and associating with that function definition.

[00:02:07]
>> Will Sentance: Very nice, I like that. And storing it in this global memory. So I'm gonna draw my functions, if you haven't heard this before, like this. This is little boxes, little boxes with an f in like maybe you did at high school. Did anyone actually do this in high school?

[00:02:23] Ever draw a function as a black box? No, nobody actually did. I don't know where I got that idea from. I'm convinced it's a thing. I'm convinced of it, now I actually did it. Okay, and the final line here, Lindsey says do what? Or not final. Next line, Lindsey.

[00:02:38] You're gonna get it right now, aren't you? Lindsey, what's the next line say?
>> Lindsey: It stores the string, Will, in the variable name.
>> Will Sentance: Brilliant, Lindsey, that's exactly right. And Lindsey, I don't understand. Why did you skip over the body of the multipleBy2 function?
>> Lindsey: Because this function was never called.

[00:02:55]
>> Will Sentance: It's never called. We never go and initialize the stuff inside that function and memory until it's called. And by the way, that's not surprising, because if you look at this const result, what would we even store in memory under result if we haven't called the function? There's no such thing as hypothetical values.

[00:03:12] You can't sort of store in memory input number with 2. It's not just hypothetical. Until you actually call the function, nothing in that function makes sense, right? So you do not go inside your functions, ever. The thread or execution will never go inside the function. The thread will never weave its way inside the function if you never call the function.

[00:03:33] As soon as you call the function, in you weave. Okay, good? So there we go. We start, when we run our code, create a global execution context. Execution context is a very fancy sounding name for two very simple things. Reading the code line after line, doing it line after line.

[00:03:53] That's what we're doing here. I'm not always writing it all out. But essentially we're going through the code line by line here. And by the way, if we execute any functions, if we run any functions inside here, we start running them here and creating a memory where every single piece of data we announce with it's label will be stored.

[00:04:14] All right, so there we go. That's known as a global execution context and it's global. It's global because we've just started running the whole file. It's not within an individual function yet. It's at the whole file, the global level. Okay, so the thread. Lets remind ourselves, this thread of execution that takes the code line after line, how many things can it do at a time in JavaScript?

[00:04:42] Amin?
>> Amin: One.
>> Will Sentance: One. What's the posh name for doing one thing at a time, Amin?
>> Amin: Single thread, I think.
>> Will Sentance: Singled threaded. That just means we'd first do line 1, num 3 in memory. Then line 2, multiplyBy2, the function. Then line 3, name is Will. We're not doing multiple things at a time.

[00:05:01] And which order do we do these things? Well, we do them synchronously. That means one, after another, after another of not unpredictably, suddenly going and grabbing the last line and running that one. We're doing it one after another.