Javascript is Event-Driven - What makes Javascript Weird...and Awesome Pt 2

okay so let's get into the second thing that makes JavaScript weird and awesome if you just caught this video I'm in the middle of five you'll want to start from video one uh there will be a link in the description uh but the second thing that makes JavaScript weird and awesome this is the one that honestly makes it really really awesome especially if you're doing nodejs um is the event driven environment um and let's kind of get into what that means especially I'll give you an example of how it's different versus pH P um if we have a PHP script here uh and you're load say let's load tweets page two uh the PHP script is going to start doing some things maybe get your username and then go to the database get your tweets put together your HTML page spit out the page and then your script exits and it's done so your PHP script is finished um and you're good to go uh and so at that point p HP is dead it's done it's not doing anything unless you reload the page or load a different page it runs it loads all of its stuff and it dies um and if you rerun it it's going to rerun it again uh JavaScript is completely different JavaScript loads up your page and then it stays in memory waiting it waits for events because JavaScript is not just information it's user events it is Click events it's drag events it's typing it's uh scrolling um and so let's just look at code to give you some more examples this is a really common jQuery code right here it's a document ready function that says um when a button is clicked alert yay I'll show you what this does let me save and refresh click yay click another button yay all right so uh what the what JavaScript is doing when it runs this is nothing actually uh it's running this and remember those first class functions that I showed you the last video here's one right here we're basically giving the document ready function one argument which is this so whenever the document's ready run this function so JavaScript is not actually this script that we have right here is not doing anything until the document is ready then it fires this function which sets up a listener on button so whenever the button is clicked now it's going to fire this function as argument number two so once again JavaScript hasn't done anything again we have a listener for the button click and that's it it's event driven it's listening for a click event on the button um and so the implement the imple implementations the implementations uh what this means is huge uh and so it means that there's this entire ecosystem that has to be built around event driven programming all these other things we're going to into in the next videos are a result of the event driven environment uh it means a couple things it means that this script will fire once and it will not fire again uh just like PHP it doesn't have to refire the script every time something happens it only runs the little piece that has to run because it stays in memory uh let me show you what I mean here let me say ver a equals 1 um in onclick we're going to alert one um and so and actually I'll do that and also go console log setting this up man that's a lot of te's setting this up so we're running some setup script here and then whenever it's clicked we're going to alert not one we're going to alert a so here you go console log setting this up and when I click I don't get another setting this up console log because my whole script didn't run again my whole application did not reun um all this kind of is stayed up in memory the only thing that actually ran is this little function in this one line of the function that's all that ran on my click event so when people say JavaScript is fast that's what they're talking about JavaScript as a language is not actually really really fast but JavaScript has the ability to stay in memory and only fire what it has to Fire and that's what's fast about JavaScript especially node.js um on in nodejs your application runs it's sitting in memory um and when a page request comes through it only fires the code that has to do with that little bitty page request every everything else is already loaded in memory um and so that's kind of what it means to have an event driven environment is we can take this argument function which in this case is a call back to the click event and we can just kind of remember that callback event we can remember that callback function and fire it whenever we need to fire it and that's all we have to do so that's kind of how the event driven environment of JavaScript Works um and that actually creates some problem problems that have to be solved with complex things like closures scope and context let's go ahead and get into those and this is some of the real meat and potatoes um intermediate level JavaScript that we're about to be getting into here