Executing JavaScript Code Review

[00:00:00]
>> Will Sentance: Here we go, people. JavaScript are those two things, one is save stuff to a little data store, and with data store within JavaScript, a little store of data. What they call the store of data in JavaScript itself,
>> Sam: Sam.
>> Will Sentance: Sam. Sorry Sam. What do they call the store of data in JavaScript itself?

[00:00:21]
>> Sam: Global execution context.
>> Will Sentance: Not quite, what do they call it? Who raise your hand anybody if you know what they call it. Yes, go ahead.
>> Speaker 3: Global variable environment.
>> Will Sentance: That is the fancy name for it, very nice. What is the trivial name for it?
>> Speaker 3: Memory

[00:00:32]
>> Will Sentance: Memory. Exactly they call it memory. There you go global, it's global people because it's available in all of your JavaScript code as it's running. Anything saved in this little store of data will be available the whole time as opposed to when we run a function. It's gonna store up all that data inside the function.

[00:00:53]
Execution context it's known as we'll see in a second. And as soon as that function finish running, all the data gets deleted. All right, so, let's get storing stuff people and remember, we're doing this cuz we better understand how JavaScript runs if we're gonna be able to handle all people.

[00:01:07]
By the end of the, before we start the pair programming, you will have the full model of Node down sufficient to be able to, in theory, do anything that LinkedIn does with Node. Anything that Netflix does within reason. The fundamental tasks are doing by the pair programming which is only a few days, no, no only a few hours away.

[00:01:31]
Hours away. Hours away. All right, there you go. What are we doing then? Therefore at this moment as JavaScript code kicks off, starts running, what's the first thing it's gonna do, Matt?
>> Speaker 3: It's gonna us, the first line.
>> Will Sentance: Yeah. That's the worst answer ever, Matt.
>> Speaker 3: [LAUGH]

[00:01:52]
>> Will Sentance: What's that first line say to do?
>> Speaker 3: Assign 3 to a variable.
>> Will Sentance: Perfect. Yeah, it is, exactly, to a variable. NUM is set to 3. That means we have a label saving data. Next line, Matt. What's it say to do? If you can written up there.

[00:02:09]
>> Speaker 3: It's a commend but.
>> Will Sentance: That's true.
>> Speaker 3: [LAUGH]
>> Will Sentance: Okay, next line are the jobs it executes. Next line it executes or that it'll actually evaluate, sorry.
>> Speaker 5: It's gonna register a function called multiple byte?
>> Will Sentance: Yeah, what does that even mean? Declare, register, define, they all mean the same thing.

[00:02:28]
They mean literally take the functions label, and then its body and parameters and save the code. Do not do it now, save it later. Save it like you save a number. Registering is not the right word to me. I mean, it's not incorrect, but it's suggested, it's kind of vaguely aware of it.

[00:02:46]
Declare, define suggest it's vaguely aware of it. No. It never is gonna go back to this line. So it better hold onto all that data, in this case it's lines of code. It better hold onto it and it does. Be really clear on that people. That is what it's doing.

[00:02:59]
It's taking the label which we gave it. Which was what Matt?
>> Matt: Multiply by-
>> Will Sentance: Absolutely and it's taking all of its code and the place holders,
>> Will Sentance: Parameters they are known as, they are hopefully when we end up wanting to run this code, and how do we run this code later on Andrew?

[00:03:19]
>> Andrew: We declare the, probably, put the variable name with some parentheses.
>> Will Sentance: [INAUDIBLE] He's spot on. We execute code by taking its label and putting parens on the end, parens. Not by inserting arguments. That is a separate thing. We execute code. We take code to run by putting parens on the end of the name of the code that we save.

[00:03:42]
Perfect. All right, but for now, what's the other thing that goes into its newer function? Well, we ideally want that code to be a little bit more flexible to work with different data. What if we want to say it's gonna multiply three or seven or so we have placeholders for data that then gets inserted when we go ahead and run that code.

[00:04:02]
Two parts to running a function. One, running its code. The other, inserting actual values as inputs. So, when we save the code that's gonna later be run, we'd better have both of those things. Space, code to run. That's the body of the function inside the curly braces. We're storing that in here.

[00:04:21]
That's the body that function, if I'm storing it here. And, we better have little placeholders that are awaiting any data to be inserted. And that's the parameter between the parentheses. Okay, and that's also stored in here. Two things ready to function, we better be ready to do both, we better be ready for both of them.

[00:04:40]
It's saved. Next line, Virginia, what's the nest line of code we're gonna do after we've saved the function multiplied by two?
>> Virginia: Some more comments? And then,
>> Virginia: [LAUGH] Then create a label output-
>> Will Sentance: Excellent.
>> Virginia: And assign it to the function.
>> Will Sentance: Not quite.
>> Virginia: Or execute the function.

[00:05:00]
>> Will Sentance: Ha. Left-hand side first. Declare output is a label. People this may feel quite trivial. We're here to learn about building LinkedIn from scratch, but, but I promise you, I have a feeling that if we're gonna receive messages at any random time from Sarah roses Mac. She wants to get on Twitter at any time, any time all the time.

[00:05:21]
She's very excited by Twitter. In it comes, that's gonna presumably tell Node, because Node can listen in through actual learn later on a feature of a library of C++ code could libUV that can be aware when an inbound message arrives. Node is then somehow presumably going to tell JavaScript to run some code to look at that message.

[00:05:51]
Cuz we want to look at the message. So we want to better write code in our language that looks at the message and sees what he's asking for. Well, that sounds like we have to run some code up here later than when we wrote it. How do we bundle up code to run later than when we wrote it?

[00:06:10]
Mohammed how do I bundle up code?
>> Mohammed: Wrap it in a function.
>> Will Sentance: Wrap it in a function. So it may seem trivial people functions, but they turn out to be the most important construct in JavaScript. Code bundled up that we're not going to run now, we're saving it to run later.

[00:06:25]
And we're gonna do a lot of saving code to run late. And by the way, note here, when we run it later, we are gonna manually ourselves put the parens on the end to say run it. I have manually insert the input, known as the argument. I have a sneaking suspicion that Node might end up being the one who puts the parens on the end of our function code, who inserts the input automatically for us.

[00:07:01]
And that's gonna turn out to be the entire paradigm of node, but we'll get to that in a second. For now, let's start off by declaring output, there it is. Output, the label is declared. Do we know what to store in it yet Virginia?
>> Virginia: Do we know what to what?

[00:07:17]
>> Will Sentance: Do we know what to store in output yet?
>> Virginia: Not yet, cuz we haven't executed it.
>> Will Sentance: Spot on from Virginia. So it's gonna be uninitialized for now, no actual value. Not undefined, cuz that's an actual value in JavaScript. Meaning, if it's a constant, you couldn't then change it from being undefined to whatever the return value from multiply by two is.

[00:07:37]
So it starts as uninitialized, completely, no value. And we go ahead and now execute code. And people we kind of create almost like a mini app, like a mini JavaScript, this is JavaScript that has got memory and the ability to go through the code line by line. Anyone tell me what the ability to go through the code line by line is known as?

[00:08:00]
>> Sam: Interpreter
>> Will Sentance: What's the ability to go through the code line by line known as? Zep?
>> Zeph: Thread execution?
>> Will Sentance: Thread of execution. That is JavaScript's ability to thread its way down the page line by line and execute the code as it goes. Okay, well, we need the very same two things to run a function.

[00:08:21]
Roman, what am I calling multiply by two with?
>> Roman: Function?
>> Will Sentance: What am I calling it with? What input am I calling it with Sarah's?
>> Sam: Emphasis?
>> Sarah: For output you're calling it
>> Will Sentance: Which is what value?
>> Sarah: Three,
>> Will Sentance: Three. Excellent. Thank you Sarah Rose. And now, we are going to execute what's the intuitive meaning of the word execute, William?

[00:08:47]
>> William: You're gonna run it?
>> Will Sentance: Run it. You're gonna run the code or multiply by two.
>> Will Sentance: To run code of a function, what do we need? We need a new?
>> Sam: Execution context. [LAUGH]
>> Will Sentance: The movement is spreading. I mean the movement is literally just the official word from JavaScript.

[00:09:11]
But in some ways it is a movement. Exactly an execution context. People it's just a mini app, like a mini JavaScript app like the big one we were just in, just the two things we need to run code places store stuff that shows up, a memory. And the ability to go through it line by line.

[00:09:27]
Okay. Same thing to run a function's code. You're gonna have another memory. That means a store of data. This one's temporary. They call it local or temporary. I call it temporary sometimes, and it's just for inside this function. And when we leave the function, what keyword makes us leave a function?

[00:09:43]
>> Sam: Return.
>> Will Sentance: Return. If there's no return, we just leave the function automatically when we hit the closing curly brace. Everything is deleted in here. Okay, so, first thing in the local memory, Zep, is what?
>> Zeph: Input number.
>> Will Sentance: Input number. And it's set to what value?
>> Zeph: Right now it's 3.

[00:10:01]
>> Will Sentance: 3. Then we do declare result. It will be 3 by 2 which is 6, and we return the value of result into output and assign it to output. There we go folk. This is the heart of JavaScript. Two things it does, save data and code. Run code on data.

[00:10:22]
What's the first thing it does Matt?
>> Will Sentance: What's the first thing it does, Michael? What's the first thing it does, Virginia?
>> Virginia: Updates data.
>> Will Sentance: Yep, and-
>> Sam: Garbage collection.
>> Will Sentance: And code known as-
>> Sam: Functions.
>> Will Sentance: Functions, and the second thing it does, Sam?
>> Sam: Runs it?

[00:10:42]
>> Will Sentance: Runs code on data. First thing it does, Matt?
>> Matt: Runs code.
>> Will Sentance: Second thing it does [LAUGH]. Charlie, first thing it does?
>> Charlie: Saves code and saves data.
>> Will Sentance: Saves code and data. Correct. Second thing it does, Matt?
>> Matt: Runs code.
>> Will Sentance: Runs code! Matt, you are gifted beyond.

[00:10:58]
All right, now, that's all it does. Now you see the at the hard part is you know it does some interesting things like, when you save a function it bounds it or it links it to all the surrounding vibrant things. But basically it saves data and code, I know Matt do it again, and runs that code on the data.

[00:11:14]
That's all it does. But we're the ones who tell it to run the code by doin what? How do I say to run a function Charlie.
>> Charlie: You, apply a parentheses at the label.
>> Will Sentance: Fantastic, add parentheses on the end. Spot on.
>> Will Sentance: I just have a feeling that it might be that someone else is gonna be putting those parentheses on for me and it's gonna be the most important part of Node.