Hi, my name is Bob Tabor and in this course you'll learn about JavaScript the language. This course is aimed at those who are absolute beginners. So beginners to JavaScript and frankly, given that we're going to discuss some very basic things like if statements and for loops, it's really designed for those who are beginners to programming in general. So if you know some HTML and some CSS and you want to learn JavaScript, awesome. You're in the right place. So there's nothing specific to Windows in this course. The tools that I use will be free and available in Mac and Linux as well. So you should be able to follow along no matter which operating system you're comfortable with using. Now my background is really not all that important but in case you're curious, I am a software developer by day and by night I run a website called Developer University or DevU. You can visit me at www.devu.com. Occasionally Microsoft invites me to create courses and what you see here is a collaboration between myself and the good folks at Microsoft Virtual Academy. I've been creating courses like this since 2004 and I created a very successful version of a JavaScript course way back in 2011. It's been viewed millions of times and I've got a lot of very positive feedback about it. This is a rewrite, a complete rewrite of that course because frankly JavaScript has changed dramatically in the what, six or seven years since I originally recorded that course. And so if you're already a software developer coming from a different programming language, just kind of to pick back up what I said earlier, this might move a little bit slow for you. It just wasn't designed with you in mind. There might be some other courses that can move you through the introductory material a little bit more quickly than what I plan on, than the pace that I plan to take with this course. And my focus is the JavaScript language, the pure language, not web development necessarily. Although we will discuss JavaScript in the context of the web browser at the very end of this course, but it felt like teaching JavaScript and how it's implemented in the web browser clouded the discussion of JavaScript, the language itself.  We're going to discuss the language. We'll discuss popular patterns that have emerged from the JavaScript development community to help overcome some of the challenges associated with working with such a highly dynamic language, such a unique language and sometimes kind of a quirky language. The last time that I recorded the course about JavaScript way back in 2011, the course actually had a fairly long shelf life and so much has changed with JavaScript since then that necessitated that I actually play catch up and kind of learned some of the new features that were added because I wasn't keeping my skill set up. That's how quickly things change out from under you if you're not careful. If you know anything about JavaScript, you know that the community around JavaScript is moving extremely quickly. It's the most popular programming language, not just in the web browser where there are hundreds of JavaScript frameworks and libraries that you can leverage in your own applications, but it's also becoming one of the most popular languages for server side web development, meaning the code that actually runs on a web server that can perform business logic, that can interact with data storage databases and other styles of data storage. And we're not going to talk about any of those topics in depth per se, but it is important to know that it all starts with a basic understanding of the things that we will discuss in this course, the absolute basics of JavaScript. So since this course may have a long shelf life, it's important to know that some of the features of the latest version of JavaScript, which I will be covering in this course, may not yet be implemented in all web browsers, depending on when you view this course. And then you have to take into account that some of the people viewing your website, for example, might be using very old web browsers. And so you have to keep that in account as well. So I'm going to make two general suggestions and I'm going to try to remind you about these at the very end. There are still people on the internet that are viewing web pages with browsers that were created 10 years ago. So clearly in these cases, the newer features of JavaScript, many of which we'll discuss in this course, will not be available in those browsers and your JavaScript won't even work in those web browsers. So you have a choice at that point. You can go one of two routes. You can either attempt to write your code in such a way that it is as friendly as possible to those older web browsers. Or you can use a tool which will transpile your JavaScript code that you write using the latest features of JavaScript. It'll transpile it back into a version of JavaScript that is compatible with all web browsers, even those that were built 10 years ago. And it uses a combination of techniques to accomplish this. We're not going to get into any of those. But if you want to take the first tact, if you want to be careful with the JavaScript that you write and only use those original features, I guess you can say, of JavaScript or the early features of JavaScript. There's a website for you. You want to take a look at this website called Can I Use? And so we can take a look at maybe one of the newer features of JavaScript, the Let Keyword. I'll type it in here in the search box Can I Use and it will show us the Let Keyword, gives a quick description of what it is. And then it will show for the current versions of each of the web browsers, whether it's supported or not. You can see that the Let Keyword does have wide adoption across all modern web browsers with a couple of exceptions. Now if you want to go ahead and use the absolute latest version of JavaScript, and then take that second tact where you transpile your code so that it's backwards compatible with as many versions of the various web browsers as possible, then you want to check out a website like and a tool actually called BabbelJS. So you can find it at babbeljs.io. And it will, again, use a combination of techniques to take your code. And you can see some of this little animation that's on the page right now. You can actually use this to type in some code here and see how it converts it into the older style JavaScript. And I'm not going to cover how to use Babbel in this course, but you should know upfront that writing JavaScript for web browsers requires that you give some careful thought to how your JavaScript will ultimately be consumed and who your targets are. And that definitely means that you're gonna have to take into consideration the fact that some people will be using older web browsers. The writing JavaScript that will run on a web server using a framework like node.js is a bit easier because, well, you're gonna have some upfront knowledge about where that code will ultimately be executed. But this is not a course specifically about node.js either. Even though we're going to use node.js as a lightweight means of executing these little tiny JavaScript examples that we're gonna create throughout this course. So you're gonna learn enough about node.js to be able to write a simple tiny application, but it won't do anything cool like serve up a web page. However, I'm sure there are other courses here on Microsoft Virtual Academy and elsewhere that will help you kind of take that next step. So the game plan for this course is to start in the very next video by installing the tools that you'll need to get started. And then we're gonna start with the absolute ABCs of JavaScript and programming in general. And I encourage you to follow along by typing in the code that I type in the video and typing it yourself is the absolute best way to learn. Starts to develop muscle memory. You'll have many of those aha moments where you realize, I see how these two things are related. You can hear it and that's one thing, but to type it in and to see it on your own computer working is something entirely different. I highly recommend that you become an active learner by typing in the code yourself. But I encourage you also to pause and rewind the video as many times as you need. This isn't a race. You don't consume these kinds of videos the same way you would watch a TV show, a movie or a YouTube video. If something's not clear to you, don't just let it go in one ear and out the other and worry and say, I'll figure it out later. No, stop down and figure it out now because you never know. It might be something foundational you'll need to know in the next lesson and the next lesson. But by the end of this course you're gonna be well positioned to move on to a more advanced JavaScript course to learn how to use modern client frameworks like React and View and Angular. Or you'll be well positioned to learn more about server side framework libraries, frameworks and libraries like node.js and express.js and others. But no matter what you're gonna have a great foundation to build on. If something I say doesn't make sense, again, I can't stress this enough. Seek out other sources online. And you're gonna ultimately want to know something from me. I've recorded enough of these courses. I know the questions that are already coming. You're gonna ask me if there's a book that goes along with this course that I could recommend. And I'm sorry, I don't really have a specific recommendation. Honestly, my recommendation is that you exhaust the dozens, if not hundreds of JavaScript online resources where you can simply use them for free and find them in an instant if you wanna get more explanation about any given idea that's covered in this course. Okay, so let's go ahead and get started. I wanna encourage you to take your time. Don't feel overwhelmed. Stick with JavaScript, stick with this course, and you're gonna be well rewarded, I promise.  Even if I wasn't paid to write code, I would do it because it's fun.  So I'm glad you're gonna get an opportunity to do that. It's the most fun you're gonna have on a computer, I promise. And you'll wind up enjoying it. So stick with it and I'll try to encourage you along the way. All right, so we'll get started in the next video. See you there, thanks. All right, so let's get started. We're gonna install the tools that we're gonna need for the remainder of this course. Fortunately, we don't need a lot and everything is free. And everything I show you will work regardless of which operating system you currently have installed. So regardless of whether you're using Windows, Mac, or Linux, everything I show you will be available for those platforms. The first thing we're gonna need is a web browser. I'm pretty sure you already have one of those installed, any will do. I would probably recommend that you either use Microsoft Edge or you use Google Chrome. The second tool that we're gonna need to install is Node. It is the JavaScript runtime. It's what will actually execute the code that we write. And we'll talk about that more in just a moment. And then we're gonna need an authoring tool, something where we can actually type the code in. Now in the past, I've used Notepad to actually demonstrate. Cuz I didn't wanna recommend one tool over the other. But then Microsoft came out with Visual Studio Code. It's available on all three platforms. So it's also available for free. So no matter what you're using, you should be able to download it and follow along. Now you may already have a favorite tool for creating web pages and so forth. Feel free to use that. I'm not gonna do anything that's so Visual Studio Code specific that it will exclude you. Please follow along no matter what tool you prefer. But let me put in a good plug for Visual Studio Code. I've been using it pretty much as one of my exclusive tools in my full time job for the last three months. And it's really good. So I highly recommend it. Let's get started. We're gonna need Node. And you may already have Node installed. So let's just see if you do or not. Let's go and in Windows, I'm gonna open up a command prompt. And I'm gonna type in node-v. If I had Node installed, it would display the version of Node that I currently have installed. I don't have Node installed on this computer. So I get an error message. That's good. So to begin, we're going to go to Node.js. I'm gonna type, there we go, nodejs.org. And again, regardless of which operating system you're using, you should be presented with an opportunity to download either the supported version or the current version which has the latest features. You don't need that. Just use the LTS version, which is recommended for most users. As long as you're using the version that I'm using or greater, we should always be in sync. Again, we're not gonna use any really advanced features of Node, so this shouldn't really matter much. I'm gonna go ahead and run it, run the installer here. What you see next, depending on which operating system you're using, you may see something a little bit different than what I see on screen. But hopefully you've installed things frequently enough that you can work your way through it. So here we have the Node.js setup wizard. And I'll just walk my way through, agree to the license. I'm going to pick a place on my hard drive to install this. There are some options. I'm not going to really do much of anything, but I do wanna make sure that in Windows that this is added to my path. This will make sure that Node is available in any directory of my hard drive. So when I type in Node V from anywhere in my command prompt, it'll pop up, okay? So just make sure that everything is selected and you'll be fine. It's not that large. Next, I'm gonna have to agree to Windows UAC. You may see something different here on the Mac or Linux. I'm gonna go ahead and agree to that little security prompt. And it only takes a minute or two to install Node and then we'll move on. But basically, Node in a nutshell is the V8 JavaScript engine that they ripped out of Chrome. They added some tooling around it to support things for like HTTP, working with requests and responses and with the file system. And they created one of the most robust web server tools that is available today. And many large applications are using Node currently to host their applications. We're not gonna use it for that. We're gonna use it for something much more mundane, which is to really just write out little text messages to a console window as we get started. Then we'll graduate on and use it in web pages much later in this course. All right, so I should have it installed, right? So I come over here and it still says it's not installed. I'm gonna have to reboot my computer. So let's pause, I'm gonna pause the recording of the video right here. I'm gonna reboot and then when I come back in, we should be able to move on from there. All right, so I've rebooted. Let's open up a command prompt, type in Node-V and I can see the version number. So we're successful. The next step is to install Visual Studio Code. Visual Studio Code is different than the full version of Visual Studio. So Visual Studio Community, Professional, or Enterprise. Visual Studio Code is a lighter weight code editor mainly used for web development, but I know people that use it to develop C-sharp applications and other type of applications where you can use the command line tools to compile your code and things of that nature. That's not something I would ever wanna do. It's great for web development and that's what we're gonna use it for. For authoring our JavaScript files and then executing Node commands in a built-in little command window, command prompt, like we see there. Again, available for all operating systems. You just go to code.visualstudio.com. It should be able to detect which operating system you're currently using and it gives you a download option for that. All right, and we're gonna go ahead and run it in place. Again, Windows UAC prompts me to make sure that I am authorized to install it. We get to the code setup wizard. I'm gonna go ahead and accept the agreement and we're gonna work our way through the defaults. Sure, and you can see that we can also add Visual Studio Code to the path, which will become available after restart. I don't need that necessarily for this course, but hey, you know, it doesn't hurt. In fact, let's go ahead and use it for everything here. That's up to you. You can read those options and choose what you want, but for my purposes, this will work just great. And we'll see throughout this course some of the things that Visual Studio Code will do for us as we're typing our code. Simple things like code coloring and code completion, managing our files, giving us an environment to execute command line tools like the Node command line tool. And there are many things like that, IntelliSense, others, that will give us the tools to hopefully allow us to author our JavaScript code accurately. So let's go ahead and launch it. And let's just do what I call a quick smoke test. And we don't need get for this course. I'm just gonna hit close on that. So what we'll do is go to the Explorer. It's the little icon in the upper left-hand corner here. Let me kind of pull this out and make this a little bit sized a little bit more nicely here. Great. I'm gonna close down the welcome screen. I am gonna click open folder.  Now, depending on your operating system or what your preferences are, you may want to create a folder somewhere else. But create a folder because we're gonna put some JavaScript files and later some HTML and CSS files in that folder. And we're gonna want a folder structure. So right here in the open folder dialog, I'm going to right-click and select New Folder. I'm gonna call this Source, Lowercase S in Source, and then select that folder. Now, that becomes the working folder that I'm gonna use to add additional files and all the work that we do for this course inside of there. It doesn't really want me to put Get, Install Get, and I don't want to do that. What I really want to do is go to Terminal, all right, and depending on which operating system you're installed on, you might see something different here. In Windows, you see PowerShell. It doesn't really matter. As long as you get a command prompt. And here I'm gonna type node-v, and I can see that. That's awesome. And then what I want to do is add a file inside of this folder, this working folder. So I'm gonna click on this little file with a plus symbol in the upper left-hand corner. I'm gonna type in app.js. And it opens up a new file here in the main area with a little JS icon right next to it. And here I'm gonna type all lowercase console.log, hi. I'm gonna go to the end and hit a semicolon. So let's kind of walk through this. The word console, a period on your keyboard. The word log, L-O-G. And then an opening and closing parenthesis. Inside of there, I wanna put an opening single quote mark and a closing single quote mark. And then some word. I put hi. You could put your first name. It really doesn't matter. But what does matter to me, at least, is that you end it with a semicolon. And as you're gonna come to learn, writing code is an exercise of precision. If you don't write exactly what I write, there's a chance that you will not get the results that I get. And so you wanna double check and make sure there's not extra spaces. You wanna double check to make sure that you're using the right characters. Like this is not a comma. It is the period on the keyboard. All right. This is not a curly brace. It is a parenthesis. This is not a double quote. Although that would be acceptable. In this particular situation, I would prefer if you use the single quote, which is on the same key, you just have to hold down the shift key to get to it. All right. So now I'm gonna use Ctrl S on my keyboard to save, or it might be Command S if you're on the Mac or something else on Linux. I don't know whatever you use. Or you can just go File, Save. All right. Now, watch what happens when I just use the spacebar on the keyboard. Did you notice, see that little symbol there? It went from X to a circle. That means that file has not been saved yet. That change that I made is not saved. So here again, I'm gonna use the keyboard shortcut to save it. Then I'll come back down here into the terminal. Now, how can I do this easily? Well, on Windows, the keyboard shortcut is Ctrl and then the back tick. That's usually next to the number one, kind of to the left of it on most keyboards. So the back tick will close and open up that little terminal window at the bottom. And now I can type in Node, Space, and then I want to use the name of this file. So app.js. And hit Enter on my keyboard. And it should print out that word, Hi, that I have inside of those two single quote marks in console.log. All right. Now, we can also shorten this up. Node, Space, App. We don't have to use the file extension, and it will work as well. All right. So assuming that you were able to follow along and you got to this step, then you're ready to move forward and we're ready to get started actually writing some JavaScript. Let's start that process in the next video. We'll see you there. Thanks. So our job as software developers is to author code, which is using a language that's human readable and author in such a way that can be understood and parsed and interpreted and ultimately then executed by a computer. And the code that we write, we save into files and we ask some execution environment, whether it be a web browser or in this case, Node, to take a look at this code that we wrote in this file and to interpret it and to execute it. All right. And so it's important, first of all, as we get started, to understand that how our code is going to be used. We're working and learning the JavaScript language, but ultimately the code that we write will be executed in, let's be honest, one of two, maybe even a third environment. We're either going to write JavaScript code that will ultimately be executed in Node and typically when we're writing code for Node based applications, we're writing applications that can access the file system, access the network, respond to HTTP requests and provide an HTTP response, things that are more server side in nature. All right. And then we'll also then write JavaScript code that will execute in the context of a web browser. And we would expect for that code to be able to dynamically interact with elements, HTML elements on a given web page. All right. But we might also use JavaScript to write video games in an environment like Unity, for example, and be able to author and control the various objects on screen and their animation and their interaction and so on. So there's what I'm trying to get at here is that there's a difference between the language itself and then the environment that it runs inside of. And we need to be aware of that, that those are two separate things even though sometimes they feel like one thing. In this case, console, for example, the console.log function is provided to us by Node. It allows us to tell Node that we want to print something to the command line like we did just a moment ago. Now there's also a console.log function in most web browsers and it allows us to print little debugging messages or console messages that can only be viewed inside of a web browser whenever we have the developer tools open. And we'll see how to do that much later in this course once we start building web pages and JavaScript that can interact with them. But at any rate, let's get back to the matter at hand here. If I write my JavaScript incorrectly, then the runtime, whether it's Node or a web browser, won't be able to compile it and it'll give us an error. And so JavaScript is similar to English in so much that JavaScript has a syntax and it has a proper syntax versus a syntax that's incorrect. So if you've ever taken an English class, you'll know that there are parts of speech that you're supposed to use punctuation at the end of a sentence to indicate the end of a complete thought. There are nouns and verbs and adjectives and ad verbs and prepositions and all these sorts of things, right? And so, you know, in general terms, the same thing is true with JavaScript. There are parts of speech. We'll talk about those. And so you will be learning a new language starting with your ABCs and with, I guess, vocabulary words, so to speak. And then to move on to authoring sentences that are complete thoughts and then stringing those sentences together into paragraphs in order to accomplish some higher level tasks and even kind of arranging those paragraphs together to create entire applications, alright? So hopefully that analogy will serve you well as we get started here. Our goal as we get started is to author JavaScript statements and a statement is basically just one complete instruction. It's like a sentence in English and each JavaScript file that we create, like this app.js, it'll contain one or more JavaScript statements that will execute in sequential order from top to bottom, at least usually. And I'll talk about the exception to that as we get further into this course. But there are some other similarities between JavaScript and English. For example, there's an end of line character. I was very specific about adding that semicolon at the end of our statement and that just is an indication to the compiler that this is a complete thought and it should be carried out as is, alright? Now, we also see that we have our statement all on one line of code and generally speaking, as we're getting started, we're going to write our JavaScript statements one per line. Now we'll bend those rules as some of our statements become very long. We can actually, for readability's sake, from a human perspective, we can split things up on the multiple lines if we need to. JavaScript, specifically Node, doesn't really care about that. That's really more for human readability. It can deal with multiple lines or a single line for a given statement, but be that as it may, we're going to try to strive at the beginning to write one statement per line in our files. A statement usually consists of one or more expressions. We'll talk about expressions a little bit later, but this particular expression is essentially just executing a function that's built into Node. It's the log function. It belongs to an object called console. We'll talk about objects and functions a little bit later here and we execute it by using operators, those in this particular case, this is the function vocation operator or the method invocation operator. It's those open and closing parentheses. We can even then pass in what are called arguments to those functions. You can see that each little piece of this has a name and it has a role to play in creating our functions and we'll learn more about that as we move on here. One thing to note is that JavaScript is case sensitive and this trips up a lot of people to begin with. That's why I was very specific to say, hey, don't accidentally or mindlessly use capital letters to make sure everything is lower case. Let's see what happens if I were to save this work that I did here with the capital C in console and the capital L in log. Let's go node space app and hit enter and we get a reference error console is not defined. It's not defined inside of node. Console doesn't exist with a capital C inside of node. It exists with a lower case C inside of node. The same thing is true with the function name log. Let's go ahead and I'll just use the up arrow on my keyboard that'll give me the last command that was used in the terminal. So again, node app and I'm going to try to execute this little program again and I get another error this time console dot capital L log is not a function. That's true. It's because it's lower case L in log and I'll save that change and then we'll re-execute this and it will work. Now there are some things that, especially when your application is small, don't matter. So you might have accidentally left off that semicolon at the end and the application still runs but that's a bad practice to rely on that. You should always try to create properly formed sentences even though you could write an English sentence or a text message that somebody could understand that has no punctuation, has no capital letters and things of that nature that would make it a well-formed English sentence and you're relying on the person receiving that text message to understand what you're trying to say. The computer doesn't work that way. It needs to know exactly what you're saying and so you have to be precise. Precision is the key as a software developer. All right, so what I want to do here as we kind of start wrapping things up for this first foray into JavaScript, I'm going to comment out this line and add some new code below it and use that as kind of the next step beyond where we're at right now. So to tell the compiler to ignore a line of code, I'm going to add a code comment and here I use two forward slashes. I added also a space but that was really just for readability sake so that myself as a human I can kind of make an easy distinction because sometimes all these characters run together. I like adding a space between this but these two characters say everything out on this line of code don't compile it, don't try to use it, all right? And we'll see in a moment that there's another way to create code comments as well. But here let's create something a little bit more interesting. I'm going to say let x equal 7. I'm going to say let y equal 3 but z equal x plus y and then we'll do console.log and then I'm going to use open and close parentheses I'm going to use a single quote I'm going to type in the word answer colon space I'm going to go outside of that quote so I'm going to go between the closing single quote and the closing parentheses and I'm going to make some space for myself in there I'm going to use the plus key or the plus operator and the letter z I'm going to go to the end of the line character, the semicolon I'm going to save it all Now before we actually execute this what do you think this will do? What do you think will be printed to our console window? Do you have any guesses? I'm betting that your background in math or algebra probably will lead you to the correct answer and I think that your intuition in many cases is something that's important as your learning JavaScript it is human readable it should be somewhat understandable it might require a little extra explanation because there's some things that are not extremely obvious but for the most part this shouldn't blow you away and nothing we cover should ever blow you away it just might require a little extra effort than you're normally used to putting into things but by no means impossible, right? So just take some comfort that this is well-traveled ground and that if I can understand it let's run the application and see that we get the the correct result which is answer, colon, space and the number 10 so how do we get that? Well, we have something here, let X and even though, again you're not a JavaScript developer or an advanced JavaScript developer just yet I'm willing to bet that you understood that we were creating a variable essentially that could contain a value and immediately we set that variable equal to the value 7 and then we did the same thing with the value of 3 we put that into a different variable a different bucket called Y and then here we have an expression an expression that will add two values together what are the values inside of those variables X and Y well we just assign them in line string 4 and we know that probably means we're going to add those together to get the result of 10 and we assign that into a new bucket a new variable named Z and then we merely print out that literal string but then we also say also append the letter or the value that's in Z now hopefully that made sense to you even before we ran the application but you can see here that for example the plus symbol has double duty it's serving to be the addition operator but it's also serving to concatenate two values together in this case two string values together so that we can print it out to screen so we're going to use this kind of as a starting point and talk about this at more length in the next in subsequent videos but hopefully up to this point you get some comfort level you're writing some code you're getting your hands dirty in the code and you know I know you can do this so just keep pushing forward and let's pick it up in the next video we'll see there thanks in this video I want to continue talking about line number three so that we completely come to a full understanding of what variables are in JavaScript so I'm going to add a new file and I'm going to do that by hovering over the source tab of the explorer and I want to type in variables.js like so and then I'm just going to copy in the code that we had here we use this as a starting point alright so let's focus in on line number one let's just first of all let's make sure this still runs and let's go node and this time we're going to give it the new file name variables and we get the same result as before great so what is a variable I think I said at the very end of that previous lesson that a variable is basically just a an area in the computer's memory where we're storing a value we're requesting or declaring our need for a new variable a space in the computer's memory where we can put information and retrieve information and then we can from that point on continue to use that variable to store different values and retrieve those values back out throughout the life span of the application so there are actually several different parts to the variable declaration statement in line number one the first is the let keyword and let's start talking about the parts of speech in JavaScript a keyword is something like let and we'll see some other examples later but essentially think of it like a verb in the English language it's an instruction to the JavaScript compiler that we want to do something that we want to take action so we want to create a variable with the name of X and we're expressing that intent to JavaScript using the let keyword so that's the first part of it and then the second part is the name of the variable that we want so we're requesting that an area of storage a unit of storage is assigned to our application where we can put things but how do we reference that again it needs a name so that we can get the values and put new values in memory alright and so that's usually called an identifier we want to declare a new variable with the identifier of X and we're going to talk about naming our identifiers naming our variables there's some rules and some conventions that we need to follow as developers alright we'll come back to that at the very end of this lesson now before we get too far there's actually a couple of different ways to declare a variable in JavaScript the original keyword that you'll see used and used in 99% of all tutorials and articles and books and videos is the var keyword and until recently this was the only way that you could declare a variable in the latest version of JavaScript however the recommendation is to abandon var unless you really need it use the let keyword instead or the const keyword which we'll talk about in just a moment if we were to save our application using the var keyword in line number one and then rerun it nothing would change so what's the problem with var there are some well I guess there's two ways to kind of explain it at this point the first is that its usage is very nuanced it does stuff that somebody new to JavaScript may not anticipate the ramifications of until it's too late and there are problems in code we'll talk about the var keyword and how it relates to scope and so on in an upcoming video but we need to introduce some more concepts before we can get to the point where that discussion is even interesting okay so it's usage is nuanced and the ramifications can be pretty challenging if you're just getting started so that's why the people who decided what goes into JavaScript said why don't we introduce a new keyword called let it will work like most other programming languages as you try to learn JavaScript hopefully it won't be problematic so that's why we have the let keyword the other keyword for declaring a variable is const and we use that whenever we want to express our intent to the JavaScript compiler that we do not intend for that variable to ever change its value so what we initialize the value to in this case to 7 we wouldn't expect that to change throughout the lifetime of the application and if we try to change it like in the very next line of code we can attempt to set it equal to 6 I'll save that let's go over and try to run that code we're going to get an error and it actually is pretty helpful it gives a little carrot right underneath the equal sign and it says assignment to constant variable that's the problem and the issue here is that we've said to JavaScript we never want to change that value and then the very next line of code we say yeah I'm going to assign it a new value and set it equal to 6 and it says can't do that so for the most part we're going to use the let keyword most of the time because that's the recommendation now in as we learn JavaScript alright so just want to point out that we can uncomment out line number 2 as we assign the value of x to different values and we can keep doing this as many times as we want to so at this point in line number 1 we've declared the variable set it to the 7 then we've assigned the value of 6 then 5 then 4 we can keep changing the value in the computer's memory and what is the value in line number 6 what's x's value well the last time we assigned a value to it was 4 so the application now whenever we run it will give us 7 because 3 plus 4 equals 7 right so that's what we get in line number 7 great alright so I guess this should be obvious at this point the equal sign here is actually what's called an assignment operator this is how we assign a value into a variable and we can keep assigning values as many times as we want but we can only declare value our variable one time so if I were to try and come down here and say let x equals you know 7 again or let it equal 8 I'm going to get an error whenever I try to run the application the identifier x has already been declared again you can only declare variable once but you can assign its value as many times as you want to after that alright so in line number 1 not only are we declaring the variable then we're also assigning its value right off the bat in the same line of code and when we do that it's a technique called initialization this is actually two lines of code rolled up into one lines lines number 1 and 2 now are roughly equivalent to what we had before well roughly equivalent there is one difference here at the end of the execution of line number 1 what is the value of x well let's find out console.log and then we'll just say what's the value of x at this point and then let's run the application and you can see that first value that's output above what we get now in line number 11 is the term undefined we'll explain what undefined means in more detail a little bit later but essentially it is what it sounds like we've declared a variable but we've not defined it we've not put a value into it so it's undefined and that's generally not something we want it might be in some cases something we need but for the most part we won't do that at the moment of declaration you also initialize your variables if you can alright so that would be valid right there alright so now let's finish this up and talk about the rules for naming our variables the variable name itself I think I've already referred to this as an identifier and so there are rules for identifier names and then there are some code conventions and these are not enforced by the JavaScript compiler but are rather things that are best practices as determined by the community of software developers who've come before you so let's talk about those things which are hard and fast rules that will actually break your application rule number one is that all identifiers, all variable names have to begin with either a letter a dollar sign or an underscore so that's rule number one the variable names can contain letters or numbers dollar signs or underscores but no other special characters and you can't use a space in between two words that you intend to be considered together as an identifier identifier can't have any spaces and then rule number three is that you can't use any keywords so I can't do something like this let equal to eight and if we try that we're gonna get a weird error let is disallowed as a lexically bound name alright and so even if we were to scroll up just a tiny bit it puts that, those carrots right underneath the let the second one because we're trying to use that identifier but it's already a keyword right so you can't do that alright so those are your own oh yeah there's one other rule and that is that variables variable names identifiers are case sensitive so we could do this and it would be a perfectly acceptable application these are two different variables uppercase x and lowercase x so if you intend to do something like this let's see what we get here alright it doesn't it doesn't blow up so we were able to use x and assign it to eight but we didn't declare the variable well something fishy is going on and we'll get to the bottom of it before the end of this course but the key to this is that we did not we're not working with the same x as we're working with here alright so let's just get rid of that but those are the rules has to begin with a letter a dollar signer underscore the rest of the name can have pretty much anything including numbers but no spaces or other special characters can't use any keywords for names of variables and be aware that variable names are case sensitive now there are code conventions and these again are just good practices the first one is that variable names should be descriptive and unfortunately x y and z are not very descriptive names ideally we would use something like maybe let's go down here so let first number equals seven and then let second number equals three and then we could use that in line number 12 instead here's some better ones actually like if we wanted to capture information or represent information like the first name or let the code two equals zero two and so on alright so use names that represent the thing you're trying to store and it from an application perspective what meaning does this variable have inside of our application meaningful variable names the second is camel casing so if you are going to use multiple words you should use this format called camel casing and that means that the first word of your variable name should be lowercase so the f in first is always lowercase but then any subsequent names that we append or words that we append together should have a capital letter so you can see that I follow this convention every single time in lines 15 through 18 lowercase z in zip code capital c in zip code alright so camel casing third one is to be consistent and that is to always follow the same kind of naming convention and this would be true kind of a cross not just the names of variable names but for every other type of identifier that we wind up creating in our application stay consistent pick one style and stay with it throughout the remainder of the application and then the other is to not rely on case we've already seen the danger of that but what if I intentionally wanted to let zip code equals 60459 what we've just done while it's grammatically correct from javascript perspective and those are two separate variables in line 18 and 20 we've introduced some subtle dissonance in the application now it's more difficult for me to see that these are actually two different variables and maybe I intended to do that but that's poor programming practice we might choose maybe a better name like first zip code and second zip code that might be a better way to go about that same sort of thing okay so those are the code conventions and the naming rules for variables and that's just about everything you need to know about variables just about there's actually a little bit more that we need to talk about and we'll finish up this discussion in the next video when we talk about the values that we're actually assigning into variables and their data types and we'll talk about that next see there, thanks in this video we're going to talk about the values that we store in variables and we're going to talk about the types or rather the data types of those values and why they're important so to begin with let's go ahead and create a new file called data types.js and this is where we're going to do all of our work and one of the things that makes JavaScript so unique when compared to other programming languages is that whenever you declare a variable like we do here let x equals 7 the variable itself does not have a data type only the values that we store inside the variables have the data type so we kind of see this whenever we're working with variables we can use something called the type of operator and this will tell us the data type that we're working with so well let's go ahead and go back to here let x equals 7 so let's start off by just going console.log and then we'll say type of all one word lower case and then x and let's save that save it and here I'm going to type node and then data types and you'll see that it outputs a number so that's one of the first data types the x data type is a number and a data type is really just the kind of data that we want to store so if you want to perform math or some algebraic operation then you want to use a number and if you want to do a yes or no true or false evaluation then you'll want to use a boolean and if you want to display something on screen then you'll want to use a string which is basically a shorthand for string of characters and you usually represent those with single quotes with whatever string of characters you want to use inside of it so let me give you a few examples here we've already looked at number let y equal true and so then we'll do console.log type of y and then I'll just go ahead and do z as well let z equals hello world and then console.log z oops not to z I want type of z alright and so now let's go ahead and run this and we can see that we get the three data types that we're currently working with a number, a boolean, and a string so in the case of a number it can be any positive or negative number it can even have decimal values in the case of a boolean it can either be true or it can be false those are the only two values and then if we want to create a string it's going to be anything inside of the single quotes it's a literal string of characters I literally want H-E-L-L-O space W-O-R-L-D alright and so those are your three of your seven basic basic types data types there's also another case let's let A and then console.log the value of A and then console.log type of A alright and just to remove the confusion here I'm going to use a multi-line comment this allows me to avoid having to do this on every line right I can just do this little slash star at the top then go down to the bottom of where I want to comment out and then star slash you can see everything that's highlighted in green or turn to the green color is now commented out just as if I commented out each individual line separately so here I'm just creating a variable A but I'm not initializing it to a value remember we saw do you remember what an output when we did this before it output the value undefined but we want to see what the type is said that it's the value that's assigned to the variable that has a type so what is the type of a variable that has nothing assigned to it well that's what we're going to get to the bottom of right now so we see that the value is undefined and the type is undefined so now we have four types we have number boolean string and undefined and there's two or three others that we're going to look at here before the and we'll get to them they're a little bit more complex but those are the four that we have to work with at least to start off with and so that's all I really wanted to say the next thing we're going to talk about very quickly is how I would convert one type into another type how do I force javascript to treat a string like this console.log and then a literal string of the value 9 how do I make it treat it like the number 9 well we'll talk about that in the next video we'll see there thanks in the previous video we learned that values not variables have a data type and that the data type is essentially a description of what you want to do with the data there's more to it than that but for our purposes right now it's essentially what we intend to do with the data and we learned of four data types and we'll learn about a couple more a little bit later there's the number data type the string the bool and the undefined so let me ask you this what happens when we need to use them together and they don't quite work the way that we think they should what options do we have then so let's go ahead and create a new file I'm going to call this coercion coer c-i-o-n dot j-s I think that's how you spell it and let's start off with a quick little example here so let a equals seven let be equals the string the literal string so I want to use single quote six single quote all right and then let c equals a plus be and then console dot log answer and then see all right before we execute this application what do you think is going to be output when we run it what will the answer be all right get that in your mind and now let's go node and coercion and looks like we don't get anything at all oh I need to save this okay there we go let's try that again there we go we get the answer seven six wait seven plus six should be 13 right why are we getting 76 something I can see what's happening it's not treating these as to numeric values it's treating them both as string values so it's not adding two numbers together somehow it's coercing that a from a string from an integer into a string and then concatenating together a and b so this operator the plus operator we saw how we can use it for addition but we also it plays double duty and it's the string concatenation operator but more over JavaScript realizes that it can't add a a number in a string those are it's like adding you know an apple in a car together it's not like making an apple in an orange even these it's not like fruit salad it's like two disparately different things what do I do well I will I will take the numeric value and coerce it convince it force it against his will to become a string and then I will concatenate the two together so that's the notion of coercion and most people consider that to be an evil thing or a very dangerous thing and others just say well it's just what happens you know it's just part of the language now what if I really wanted to perform addition on two integers well then I would need to take steps to force the string six to become a number so that I could then add them together and so to do that there's actually a special function that will force that conversion so let me change this just a little bit and we already have the value B so I'll just reuse the value B and I'll set B equal to parse int now I want you to notice something I haven't really talked about visual studio code much but one of the nice things about visual studio code is that it popped up this little box called intelligence and intelligence is just a visual cue as I'm typing to show me things that I might need to reference or things that will help me to find the right command or the right idea in this case I knew it was something parse so I start typing in and I can then use the arrow keys to start looking I'm like oh yeah there's poor parse float that would give me a number with decimal values but this in this case the string that I want to use I know that it will only be a value without without any decimal points so I want to use the parse int now what I can do is just use the space bar or like the opening parenthesis whatever the next logical character is to do what's called code completion so I don't have to type everything else now in this case I know that I'm going to need to use the parenthesis for reasons I'll talk about later so I'm just going to do an open parenthesis well it didn't do it for me well there we let's just go ahead and use the tab key instead alright so the tab key will give me what I want now I'm inside the the parenthesis and I need to pass in first of all the string that I want to change so in this case take the value of B and then I need to give it optionally what's called a radix or radix and that is essentially the base system so if I wanted to to use like a hexadecimal I might give it 6 but in this case I'm going to give it 10 because I want to use a base 10 or a decimal conversion alright so it's a little technical but typically if we use 10 in there we're going to be just fine so essentially what I want to do is take the 6 and based on the normal decimal system I want to convert that into a numeric value and then I want to continue on in lines 4 and 5 like we had before let's see what we get this time the answer is 13 just as we had hoped alright so the parse int is a built-in function to javascript and I can count on it being available in node or in a web browser or any other implementation of javascript alright so I guess this begs the question what if I try to do something kind of evil with this so let d equal parse int and then use the tab key to do the code completion and this time I'm going to pass in a character that will not convert to a or even a string that will not convert into a numeric value especially when that's decimal so I'm going to save this now let's go ahead and console.log it and d so let's go that and then we'll do this alright and I get n a n which represents not a number it's not really an error it's just telling us that the value we passed in is not a number we could actually do something along these lines as well let e equals is n a n and then I can give it some numeric value in this case I'll give it d and I'll do console.log e so let's save that run it again and so this time now I'm evaluating whether d is not a number and that is true it is not a number because I can see it here I can just print it out alright so we saw two built in functions but there's a bunch of built in functions for various things all kind of centered around in this case just working with coercion and checking the results of that attempt to to coerce or convert one data type into another alright unfortunately there's no parsed boolean so you can't take a string of true or false and convert into a boolean you'll have to take a few extra steps of examples online for that and so depending on the type of conversion that you're attempting to perform it may not be easy to convert from one to the other there's always a way and usually you can find some code online especially on a site like Stack Overflow that will help you figure that out but that's all I wanted to say let's continue on in the next video we'll see you there thanks in this video I want to refocus on the JavaScript syntax specifically and the various parts of speech inside of a properly formed statement in JavaScript so I started by explaining JavaScript by saying that you write statements each of which are executed sequentially and statements are complete thoughts complete instructions to the JavaScript compiler of what we want it to do for us and I said the statements are made up of one or more expressions of the type of operators and operands and I just made that statement in passing and kind of blew past it really quickly but I wanted to take a few moments and explain why that is an important statement whenever we're setting out to write code and so we've already looked at a couple of different operators if we're thinking about the most atomic level of our JavaScript statements we're thinking about in terms of operators and operands so operators are key words we've already looked at the addition operator using the plus symbol we looked at the string concatenation operator using the plus symbol so that one is doing double duty and it will be understood based on the context of how it's being used and then there's the assignment operator the equal sign that we've already looked at and soon we're going to look at a few other common ones just to start building out a list of operators that we can use to do more interesting things inside of our application but there's also an operand so operators are things like keywords and those various symbols that we've already looked at and we'll add more operands are something like identifiers a variable name we'll learn about functions soon and functions are another type of operand and so unlike keywords and operators in JavaScript which are fixed in part of the language we and I programmers give operands their name and so by combining operators and operands we create expressions that are then used to compose statements and so sometimes it's easy to spot an expression and then sometimes it's not so easy but identifying several major categories of expressions we can better understand why JavaScript works sometimes and why it doesn't work sometimes so for example in the English language we cannot write a sentence a proper sentence like this the dog period if we've said hey the dog our friend would say what are you talking about the dog did what which dog you know give me some more information right why is that not a proper sentence in English because it didn't have enough inside of it to be considered proper we have a noun we have the dog but we don't have any verbs or adjectives or adverbs describing or or kind of giving us more detail about the dog the same thing is true with JavaScript so we can't for example and let me just create a quick file here we'll call this expressions.js so we cannot do something like this in our program right because the JavaScript compiler will say ok what do you want me to do with that that makes no sense to me whatsoever I don't know what you want me to do with A I don't see it it's not one of my variables you're not asking me to create a new variable there's nothing inside of A A means nothing to me alright so at a minimum we're going to need to either and these are the types of expressions in a very high level we're going to either declare a variable so we would do something like this once again let A alright and even in this little tiny two word line of code there's already an operator and an operand here's the operator the let keyword and here's the operand a name we want to give to a new variable that will be created in memory alright so that's one type of expression we're going to call this types of expression here we'll just use some comments types of expressions number one variable declaration I spelled that right alright so let's go ahead and just move that up to the very top and say this is bad and then we'll do something like this I kind of like doing some nasty art there whenever I create lists inside of my code alright so there we go the other one is to assign a value so the other type of expression we can assign a value so A equals three or four and then another type of expression is to perform an evaluation that returns a single value so that might be something like and if we're talking purely about the expression itself it might be something like that B plus C so in a more interesting example we might do something along these lines and I'll just comment this out because I want to reuse A there we go good alright so here we go line number 16 I'm going to go let A B equals three let C equal two and then let A equal B plus C I just want to focus on line number 19 and I want to say that there are three expressions in here can you find them alright well let's find them so number one we're going to see that let A so that's a variable declaration the next thing that's going to happen is we're going to perform an evaluation of B plus C right and that will basically add those two values together because we're using the addition operator and then finally we'll do the result of B plus C is assigned to A so three expressions all combined into a single statement and there's a lot more going on than meets the eye but that is the kind of thinking that will help you understand why your javascript code works sometimes and sometimes it doesn't you have to think in terms of writing expressions that do things to form properly formed javascript statements so hopefully that little lesson in syntax is helpful let's talk about operators and the different types of operators and again we've used this collection of five or six operators so far let's let's add to that collection I'm going to go create a new file called operators .js and so there's several categories of operators and I'll just kind of go through them really quickly here so there's assignment like the equal sign it's really the only one in this category but it's a pretty important one we've seen to use quite a bit there's maybe some other keywords and things that can fall into this category sort of but the assignment operator is usually the only one in this category and then there's arithmetic with which as you might suppose would allow you to do mathematical style operations so that's the plus where we're adding two numbers together subtraction multiplication that's the asterisk key over the eight on most keyboards there's also the division alright and then there are some special ones like let's call these and I'll they're kind of arithmetic but I'm going to call them increment decrement so this is the plus plus and the minus minus and use out of context these don't seem so interesting but what we could do is for example let's go var a equals one a plus plus and then console dot log a let's save that and then go over to our terminal and I'm going to do node operators alright and so you can see that we increment the value of a so let's do this let's now increment it one more time and see and let's save our work here and then let's run it again and wait a second the value is still two how is that possible let's do this console log a like that so now we're going to print the value out twice we're going to print it out I thought maybe we would get three but we didn't but if we printed out a second time let's see what value we get and so when we print it out the second time we get three and the reason is this because this operator this increment operator works after the line or after the value is already utilized inside of this line of code so basically hey console.log here's a and after you print that screen then let's add something to it that's why we're able to see the new value if I print it a second time alright what we may have preferred instead of this is to go console log and put the plus plus before the a that means I want you to first evaluate the increment of a and then print it to the console.log alright so let's say that let's rerun this and now we see three in both cases the same would be true with the decrement where we could subtract either before or after the evaluation of that variable alright just something to keep in mind alright so that's increment and decrement there's also going back to arithmetic there's the modulus and this will give me the remainder amount so let's go var m for modulus equals 10 divided by whoops whoops whoops that's not what I wanted 10 modulus 3 and then I want to console.log m and just to kind of keep everything clean I'm going to comment out all of this as well keep it around for posterity but otherwise that's all I want to see what will I get back from this the statement and I get one what is one it's the remainder so 10 divided by 3 equals 3 with one left over that one is the modulus alright and actually this becomes a lot more interesting and important when we're looping through lots of values and every like 10th or 20th or 100th item I want to print a little message to screen to say hey we finished processing the 10th the 20th the 30th the 40th the 50th item alright and I use that actually frequently so I'm a pretty big fan of modulus comment that out so moving on to the different categories of operators let's talk about the various string operators and we've already seen these so this is going to be like the literal string operator we're using single quotes and then also we saw the string concatenation operator that will take two strings and allow them to be appended together to create one new string other operators precedence so we might you know order of operations we actually use this quite a bit even in non-mathematical situations so for example let's just do var b equals 1 plus 2 times 3 now if you're coming from an algebra background there's an order of operations where things should be done in a certain order and I'm pretty sure if memory serves me correctly it's been a long time since I've had an algebra course but you perform algebra before you perform addition so if I were to do a console log here I would expect b to output 2 times 3 plus 1 so that would be 7 let's see if my memory serves me correctly here and yes it does but what if that's not what I want well I can use just like in algebra I can use parentheses to kind of control the order in which things are evaluated so in this case I would do 1 plus 2 first and then multiply that by 3 which will give me a completely different result of 9 because 3 times 3 equals 9 okay so we'll use this the opening and closing parentheses for different purposes for example whenever we want to do console.log these parentheses are also used as the function invocation operators and that just says here's a function name called log and we'll learn about functions soon but I want to actually invoke the function now and I can even use the function invocation operators the opening and closing parentheses to pass in arguments and we'll talk about that a little bit later but again that is the opening and closing parentheses there are other operators and I'll just put them here they may not make a lot of sense at the moment when we look at decision statements so there's the logical if I'm sorry the logical and and the logical or so when I want to add two things together and evaluate two things together either one of them needs to be true or both of them needs to be true and we'll look at that in a little while there's also the member accessor operator so when we did console dot log if you look at IntelliSense as I hit the dot on the keyboard there's that period why are we using a period there that allows me to access the various members of this object and we'll talk about object and we'll talk about properties and functions or methods of objects soon but that's what allows me to access the log function of the console object inside of JavaScript so here again comment that out but we'll use the period for that purpose we're going to also look at the code block operator soon and so you know I'm going through all these and I'm saying hey we'll look at these soon really the point of this exercise is to say that there's lots of operators and we're going to have to begin to identify what all these special characters are and the only way to do that is to first of all learn that they exist what their function is and then use them as we're writing programs and so I think that's really the only thing I wanted to say I mean let me just put one more in here the array element access operator goes by different names but I'm just going to use that and so we'll use square brackets for that purpose so almost every single character the special characters that are above our numeric values and we can access using the shift key and the various ones that are usually on the right hand side of the keyboard the various braces and brackets and colons and semicolons and all of these are are used to for various purposes in JavaScript and in most programming languages so I think that's all I really want to say let's pick back up in the next video you're doing great hanging there with me we're getting through some of the easy stuff and we're going to start moving on to some challenging stuff here really quick but you're doing great see in the next video thanks up till now each variable that we create can store one value at a time per variable but what if we need to work with lists of data in other words I need to keep track of several people or several numbers and I need to store them in such a way that it doesn't matter if I have 2 or 10 or 100 I can kind of keep them together and move them all around and use them in my application as a list as a grouping of related values in that case I want to create an array and so let's start by creating a file called arrays.js and first of all basically an array is basically a variable that can hold many different values and so we can declare variable and initialize its value like so so here we'll do let a equals and here we're going to use an opening and closing square brace or bracket and then I'm going to give it a series of values each value will be separated by a comma 48 let's say 15 16 23 and 42 and so now I have an array of those values. Now these are just numeric values what if I wanted to create an array of string values I'm going to use something similar in fact I can use any data type inside of here that's allowable in JavaScript and we'll see some examples of that a little bit later but I might want David Eddie Alex and Michael alright and then what if I want to get one of the values I can just do console.log inside of here I'm going to use the variable name so in this case I'll use a and then I want to provide a index to retrieve one of the elements so each of these is an element of the array and I want to use an index a numeric value that allows me to get at one of those elements inside of the array the indexes are zero base that trips up beginners sometimes you for example to get at the number 4 the first element in the array I would use the index zero if I want the second item in the array the second element of the array I would need to use the index one and so on I'm going to add it I'm going to use a and then right next to the a square brackets and I'm going to give it an index so here we'll grab the first value and then I'll grab the second value and then I want to do show you how console.log will just print out all of the values for you nicely if you just want to give it the name of the of the array itself so let's save our work and we'll go node arrays alright so you can see the first element of the array at index zero gives us the value four the second element of the array at index one gives us the value eight alright hope you can see the correlation there or if I just want to print out all the values in the array I can just provide the variable name that contains the array it will print them out for me just like I have kind of here when I actually initialized our array variable alright let's comment this out now that is how we access individual elements what if I wanted to change or set the value of one of the elements the same would work so in this case I would say for example a zero and I would set it equal to seven like so and so then we can just do console.log like so and then we run our application now you see the first element of the array has been changed from four to seven because that's how we can access a single element and assign it a new value alright alright so what about these mysterious these mysterious arrays what is their data type so let's do console.log type of A and we can see that it's of type object and we'll talk about the object data type later because there's a lot more to it than just being able to create arrays but it's a little bit more advanced at this point we'll get into it soon just keep in mind that an array isn't a data type of itself it is a type of something called object and we'll talk about objects later alright so the other thing that's important to remember is that an array can include elements of different data types so let me just do let's see equals we'll start with four and then we'll do Alex and then we'll do true alright so we've used three different data types right there and we can just do node arrays oh I need to actually do a console.log see there we go there we go alright so you can see that a single array can hold different data types there's no restriction there let's comment that out what happens if I try to access an element that with an index that does not exist so let's do console.log and I happen to know that the B has four different elements in it four names and let me try to access the fifth element by using the index four and this will be undefined so just like a variable without any value assigned to it is undefined so is a element of an array undefined if we don't give it a value now I can also just programmatically determine the number of elements in an array by using a special property called length so I can do console.loga. and remember the dot is the member access operator so arrays are objects and this particular object has a special property called length which will give me the number of elements in that array so I would expect to see let's see 1, 2, 3, 4, 5, 6 so the question is is it going to give us 6 the actual number or is it going to give us to it in a zero based fashion and the answer to that is that it will give us the actual number not zero based and this will come into play a little bit later when we use the length of an array and we iterate through each element of the array to print them to screen when we learn about looping so just keep that in the back of your mind now there's a lot of strange things that you can do with arrays some of them are not always intuitive like for example if I wanted to just randomly create a new element so in this case I'm going to create what the use the index 10 which means this would add an 11th element to the array what happens with all of the elements between where we left off 0, 1, 2, 3, 4, 5 so 6 through 11 what will we get so let's just assign this to 77 and then I want to do a console.log of a and I want to do a console.log and a.length like we just learned about and kind of see what happens here and let's run that so we can see that it prints out 4, 5, 6, 7, or I'm sorry 4, 8, 15, 16, 23, 42 and then it says there's 4 empty items and then there's 77 and it says that there's 11 there's 11 items, 11 elements in this array because we filled up the 10th index or index 10 with a value so it will create essentially what's called a sparse array and that means that there are empty elements inside now this isn't usually the way that you want to work with arrays if you need to add new values because it's not as safe we're inadvertently creating elements with nothing in them there's a safer way to go about this using some additional built-in functions of the array and so if I wanted to add that value and add it to the end of the array no matter how many elements are currently in the array I could use the push method and so I say hey I want to push the number 77 to the end of the existing array so let's copy this and paste it here and then if I wanted to remove it I can use a method called pop so this function pop will remove the last element of the array in fact I can call it several times to keep removing elements of the array and here we'll just print out what the end result is just like we did previously so now this should put some fireworks into our terminal window so you can see that using push in line number 29 I was able to add the number 77 to the end of the existing array and that gives me 7 total elements now I call pop 3 times it removes 77, 42 and 23 leaving us with just 4 elements in our array so we're going to continue to use arrays they're a great way to keep lists of things together and accessible and they'll become even more important again as we learn how to loop through arrays and to evaluate each element we can even use arrays to hold on to other things like objects and functions and we'll learn about some advanced use cases with arrays a little bit later that's all I have to say about arrays let's move on and start looking into some things that are beyond the absolute basics we'll start moving and talking about functions see there, thanks throughout this course even from the very first line of code that we wrote we use the console.log function to print things to our terminal window and I kept referring to log as a function as part of the console object in its simplest form a function is merely a block of code that we as programmers can name and once it has a name then we can call it by its name but it's just one or more lines of code that we put into a block and then we say we want to execute that block over and over and over again throughout our application so again that's a very basic explanation of what a function is but in JavaScript functions can do so much more in fact most of this course will be devoted to working with functions because frankly they're one of the primary constructs in JavaScript for getting things done so first of all let's go ahead and create a new file I'm going to call this function declarations.js alright and first of all if I have some code that I want to reuse throughout my application I want to add it to a function so we can create a function and I'll walk through and explain the parts of a function here in just a moment let's create the most basic function that I can possibly think of and I'm actually going to copy and paste some code in so we don't have to type at all but nothing here should be all that revolutionary so I've created a new function called say hello notice my name I use camel casing right in order to name my identifier my function name alright and then I have three lines of code notice that they're inside of these curly braces notice that they're indented so we see kind of a relationship between this code on the inside and this line of code and this line of code on the outside so kind of represents a container relationship this code sits inside of or as part of or is rather the body of the function that we just declared alright so here we just declared a simple function this is called a function declaration this style we're going to look at other ways to define functions later and I'll draw your attention and why you'd want to choose one or the other later there's at least two other ways that I'm thinking of off the top of my head but first of all notice that we use a keyword called function then we give the function some identifier that we come up with something meaningful we'll use similar rules to what we use for variable names alright then we use an open and close parentheses you'll see how these will be used a little bit to define arguments or input parameters to our function but right now it's empty we don't require that the caller give us any additional information and then we use the open curly brace here and the close curly brace here to define the container to define the code that we want to be the body of this function and everything inside of that is just any javascript that we want to write for the most part alright so how do we actually then use this well we gave this block of code as defined by the open close curly brace we gave it a name and so we should be able to call it by its name so I should be able to do something like this right say hello and that will get me most of the way there but to actually invoke a function we have to use the function invocation operator in this case it's the opening close parentheses and obviously we want to use our end of line statement here so let's go node and then function declaration and let's see oh declaration sorry there we go alright and we get hello so hopefully you weren't expecting something super interesting we're just printing out three lines with what I would call a flower box kind of around it some dashes to style it up a little bit we can do some interesting things with regards to assigning the function to a variable so let's do let a equals say hello now do I want to invoke the function here no and I'll explain why in a little bit I merely want to get a reference to the function and then I'll do and invoke the variable so this variable is now pointing to this function and now I say okay I have a function inside of this variable go invoke it using the function invocation operators in fact here let's do it a bunch of times just to make sure that we're seeing what we think we should see here and so we can see hello hello hello all three times in a row great so let's comment that out now up to now this function is not all that interesting let me just copy it and I'm going to comment it out and I'll create a new version of this function down here beginning in line 17 and I wanted to actually pass allow me to pass in a name so I can say hello Bob hello Steve right so we'll just create a new argument into our function say hello by giving it a variable name so essentially now we're able to use this variable name in the body and we expect the caller to give us the name it wants us to say hello to so here I'm just going to use some string operators here with name and make sure things are spaced nicely and so here I can do say hello to Bob say hello to Beth say hello to Mr. Tibbles my cat alright and let's go ahead and run it and you can see now how I'm able to reuse that code but change it up by passing in the name that I wanted to say hello to alright so let's comment all this out and let's talk about one more thing that we can do with functions and that is return values from functions so this first function that we created it's merely just outputting we're not expecting it to to perform some operation and then give us some value back but what if I wanted to create a more interesting function that implements some business rule in my system in my e-commerce system like to calculate the sales tax on a given amount say a subtotal of all the items that are in my shopping cart I might create a simple function called calculate tax like so and we'll get to the body in just a moment but I want to allow the caller to pass in the amount that we're going to charge tax to alright then I'm going to say let result just the name of a variable result the amount that value passed in times 0.0825 which is the sales tax where I live and then I want to use the keyword return and then the value I want to return so you can return one value from a function in this case I want to return the amount of tax so I'm going to return result now what I'll do is I'm going to call calculate tax passing in an amount so let's say $100 and I want to capture that into a variable I know it's going to return a value to me so let's just do let and I can reuse the variable word result but I might use something more descriptive like let tax equal calculate tax and then console.log the amount of tax like so let's save that and then let's run it and you can see that for $100 purchase it would charge $8.25 in tax ok but that's what the purpose of the return keyword is to actually give me back something so this is an expression a function invocation expression it's going to give me a value back that I can then assign to the new variable tax and then I can work with that value in this case a number representing the amount of tax alright and I think that's all that I'm going to say about this for now but there's lots to say about functions it's going to again consume the majority of this course and you're going to have to become very familiar with the ins and outs of working with functions and we'll start that process in the next video we'll see there thanks. In the previous video we learned how to create a function declaration and a function declaration and a variable declaration are similar in so much that they both have an identifier or a name because we plan to call them later on in our javascript but what if we don't need a name what if we're in a situation where there's just a need for a function but that function will never be called for the rest of the application we know that then we can take a different tact we don't need to add a new identifier we can just create what's called a function expression and we don't have to supply a name we just give it the body of the function and say here go do this when you need to run some code alright and a good good use of that is whenever we need to create some code that should be in the future so here let me start off by creating function expressions.js a new file and here I want to use the setTimeout method that's available inside a javascript and if we use IntelliSense we can see that there's actually two input parameters to this function setTimeout we're going to first of all need to give it something called a handler which I happen to know is just a function. Now I could give it a function declaration but usually people just create function expressions here for the handler and then the second thing we'll need to do and I'll use the down arrow to move from the first argument to the second argument is to give it a Timeout and so that's the number of milliseconds that I want it to wait before executing this code and I'll show you how that might be interesting in just a few moments here. But the first thing we need to do is create a function expression to pass in so just here right inline I'm going to create a function open, close, parentheses open, close curly braces which denote the body of this expression I'm creating inside of here I'm going to do something simple like console.log I waited two seconds and then here at the very end of the function declaration I'm going to give it that second argument the number of milliseconds that I want to wait before executing that function that function expression so I'm going to say wait two seconds and then I want you to call this inline function I'm creating and the body of it will merely just log out I waited two seconds. Alright so here we go let's go and do node and then function expressions one one thousand, two one thousand and you can see it prints to screen I waited two seconds alright now it's kind of hard to read it like this all inline one of the things in JavaScript that's a little bit challenging especially if you're getting started is the number of curly braces that you'll encounter and differentiating for example this outer set of parentheses and this inner set of parentheses and Visual Studio Code tries to help you like when I put my carrot right next to that opening curly brace it tries to find the matching closing curly brace and you'll see as we add more curly braces for different purposes and indentation levels inside of our application. Visual Studio Code does a pretty good job most of the time of finding its match it's just a matter of looking for that carrot that surrounds the closing one here over you can see whatever in column number 61 here I'm looking at the bottom okay anything inside is just the body of the function and the same rules apply whoops I didn't use a semicolon at the end of that line but I should have it shouldn't change the function in this simple case but nothing changes about how we work with this now to be honest most people do not put this much code on a single line I may want to split this up into multiple lines so I would do this in a way that feels natural to me and you can see that as I put my mouse cursor next to where I feel like the split should have been like in the beginning of console.log and here at the end of our body of our function expression Visual Studio Code naturally will create some indentation now if I don't like that level of indentation I'm free to come in here and to change it up like I would prefer to use a tab here so I'm using the tab key on my keyboard to move things out and the shift tab to move things back that only works if my mouse cursor is here right at the beginning of that line if I were to move one character in and use the tab key well that's not what I want at all that's going to split that word up but if I use the keyboard the arrows on the keyboard to maneuver and then the shift tab to move it out I can move things in and out but that is pretty much how I would like to see that function represented right and then I use a comma to pass in a second argument in this case the number of milliseconds to my set timeout function alright so but the focus of this is that function expression I never want to use that function again but I need it in this case as an argument to pass into my set timeout function so functions can take functions as input parameters okay so just keep that in mind because things are going to get a lot crazier than that and let's move on and talk about using both the function declaration and a function expression to do something just a little bit more interesting here same basic idea here but what I want to do start off with a counter and this will count the number of times that we actually execute our function expression I'm going to start with a function on the outside function timeout let's call this function timeout like so and then inside I'm going to set timeout using that built-in function to JavaScript and pass in a new function expression alright and then I'm going to here give set timeout say in two seconds I want you to basically run this function expression that I've defined right there so I pass in the second argument of 2000 again using visual studio code to help me find the matching set of parentheses at the beginning and the end to pass in the input parameter to the set timeout function recognizing that the function expression is the first argument to that and 2000 is the second input parameter to that set timeout function here's what I'm going to do now append so I'm going to put a little space there between high and the closing single quote mark counter but I want to after every time I reference counter I want to increment it by one so this will allow me to count the number of times that set timeout has run now one of the things that I want to do is after I have printed that line I'm going to schedule the next time this code should run so I'm going to schedule and call timeout in a recursive manner so I'm using the name of this outermost function and saying hey now that you've run me run me again in two seconds because I'm going to basically call set timeout again now I need to kick this off the first time so we'll call set timeout once here on line number 15 and that will kick things off and then I'm going to hit control and C on my keyboard to stop the execution because it will just keep looping and looping and looping. Alright hopefully in your mind you understand the sequence of events here I'm going to call this function declaration once the body of that function will create a set timeout in two seconds I want to execute this function expression which will not only show me the number of times that this function has been called because I'm keeping count of it in that counter variable but then also it's going to call the timeout function again which will schedule two seconds from now the next call to the set timeout function ok so let's see it run hopefully this all makes sense so I waited two seconds saw it run once alright so twice three times and see it will just keep going every two seconds until I hit control C on my keyboard to stop its execution alright the last thing that I want to show you now comment all this out is that you can create a function declaration or I'm sorry a function expression that says something like console dot log and I'll make something a little bit more interesting later and then I can immediately invoke that function by first of all surrounding this function expression in parentheses just to kind of say hey I want to group all this together and then using another set of parentheses as the function invocation operator like that do you see that format so there's this inner set that we use to define input parameters we don't need any but we still needed in order to create a function expression then we're going to group this whole thing together and say I want to execute it so there's actually four sets of parentheses we just have to keep them straight in our mind what each of them are doing but this last set will do what's called and this kind of structure is called an immediately invoked function expression in other words I will have function expression and I want it to be invoked I invoked immediately when this application is run and this actually is a pretty common pattern in JavaScript development it comes in super handy and we'll talk about why it comes in handy a little bit later but we want to just remember immediately invoked function expression it's also just known as an I I F E sometimes I think it's pronounced iffy all right so keep in mind if ease and we'll come back to them a little bit later all right so let's move on and move away from functions just for a little bit we'll come back to them later but hopefully you can now tell the difference between a function declaration of function expression most importantly for our purposes you want to keep in mind what immediately invoked function expressions are okay all right so we'll come back to this and let's move on see the next video thanks in this video we're going to talk about decision statements there's actually three that we're going to consider the if the switch and a ternary operator and so whenever we need to add logic to our application in other words perform different blocks of code based on some condition that we evaluate will want to use one of these decision statements and so let's go ahead and start by creating a new file called decisions.js and here what we'll do is start with if statement so the basic structure looks like this if and then we'll evaluate something here some expression so let me just kind of start off with this some expression that expression should equal true or false and there's lots of ways to evaluate this we'll come back to it in just a moment we'll consider those in between the opening and closing parentheses if that is true whatever that expression is then we'll execute all the code inside so let's begin simple bar count equals three hard code of value and then say so if count and then we'll use the equality operator so this is going to evaluate for equality if count indeed is equal to four then we will that expression will return true if it's true then we'll perform whatever code we write here so console.log and count is four so the first time we run this we're not going to get really anything alright so the first time we run this we're going to not get anything it'll just exit what we can do is change this to count equals three like so and now when we run it we'll see the message count is three very uninspiring let's set this back to four and here we can consider the alternative that the count is not equal to four and we could kind of give the counter message count is not four this much we know to be true alright alright so count is not four we basically skipped over this block of code because this returned false therefore we executed the else statement this second block of code and skipped over the first one so there's actually several different variations of this we can use because there are some different conditions here maybe I don't want to jump right to that else statement maybe I want to keep evaluating I can use an else if and so here I might say else if the count is greater than four then I could maybe do a message like console dot log count is greater than four and I can do kind of the opposite as well else if count is less than four so console dot log count is less than four because that changed modalities there and then at that point this will never happen ever because one of these three conditions would occur we'd never get to this final else statement right it would just never happen so let's save our work here and see this run count is less than four because it's three okay so that's the general structure of the if statement it allows us to evaluate one or more expressions if it returns if that expression returns a true then we execute the code in the code block associated with that expression we can create optional else or else if statements to continue to evaluate other expressions usually you want to make related ones but you don't necessarily have to although that may not make a whole lot of sense depending on your business rules and then we can finally use a catch all in case none of the previous else if statements are correct and kind of capture that so let's go ahead and comment that out that's our first structure we'll use the if statement a lot the next type of statement is a switch it's a little bit more tricky to use let's start off with just typing out the switch keyword and what we want to evaluate and so what we'll do is actually evaluate whatever's in this expression against a number of cases so I might for example let hero equal Superman and then depending on the hero I might want to print out the superpowers that that particular hero has so based on the hero if that hero so if the case is Superman I would say well that hero has console.log super strength may also have x-ray vision all right let's add another case here and say case Batman and notice that kind of the format of this to use the case keyword inside of this block that belongs to the switch the case keyword the value we want to compare our case against and then a semi colon and everything that will become part of the body of that case that gets executed so in this case we'll say what are Batman superpowers he has intelligence and he has fighting skills all right and then we can also then say well the default for that hero is that they're a member of the JLA now watch how this works it works a little bit different than the if and else if so let's go ahead and say what we have and then rerun this all right so in this case it was Superman and notice that we matched the case Superman because it prints out super strength and x-ray vision but then everything else inside of all additional cases including the default case will be true as well so he also is intelligent he has fighting skills and he's a member of the JLA now if we were to change this to let's say Batman and we were to run the application you'll notice that it skips over all of the console log statements that describe Superman superpowers and they come in however here at Batman so console log intelligence fighting skills and he's also a member of JLA now we could try somebody like Green Arrow and not particularly one of my favorite heroes and he's just a member of the JLA all right now if we don't want that that flow through style what we can do is actually use a break statement in here so let's go back through this now and see what happens whenever we break out of a given case so back to Superman and now when we run it we only see that he has super strength and X-ray vision Batman has intelligent fighting skills and then Green Arrow is just a member of the JLA okay all right one other quick tip here is that whenever you're evaluating strings there's a possibility like for example Batman what if we had capital B in Batman and then we run the application and you see he's a member of the JLA why didn't it catch the case Batman because capital B Batman is not the same as lowercase B Batman in that string now what we can do to circumvent that whenever we're working with strings and we want to do some comparison with them we can use the two lowercase method of our strings so strings have a built in method called two lowercase and that will take whatever that input is and it will make sure that all the letters are lowercase so that we're really comparing apples to apples instead of apples to oranges so now when we rerun the application we get what we would expect with Batman okay all right so let me comment this out we've looked at the if statement we've looked at the switch and then the third one we're going to look at is the turn area operator and this is useful whenever I want to I want to just do a quick inline evaluation of some expression and then return back a value a string number boolean whatever probably it's a string or a number back depending on whether that expression evaluates a true or false very small short concise inline statement so I'm going to create two variables I'm going to do something a little bit different though the first variable like you would normally expect but instead of ending that line and moving to the next one I'm going to do another variable creation variable declaration and assignment right here in the same line so I'm going to create another variable called be and initialize its value to the string one right so just slightly different technique you might see that online moving on so we're going to create another variable called result and we'll set that equal to some evaluation of an expression does a equal be so two equal signs that are next to each other is the quality operator this is a check for equality to say does a equal be and if that is true then what we'll do is return the word equal as a string but if it's not true then notice the colon that separates the true from the false will return the word in equal so the ternary operator has kind of got several parts here there's an expression there's a question mark that that has true or false ramifications and we'll just do a console.log result so so now let's go ahead and run that and these are equal great we could also do this in line so let me just take this part right here and do that instead you can see how we can basically perform that same check without having to create a new variable to hold the result alright so it's a nice inline way of running a quick check and then returning back a string one string or another string now let me just go back for a second here or actually let's do this and then we'll do console.log result let me comment this one out I want to keep it around for you in case you want to reference that in the future we used two equal signs but there's another type of equality that we can check for and that strict equality and this will check to make sure that these two values are equal but then in addition to that it will not coerce for example the number one and the string one it'll say are these absolutely equal even with the same data types alright and so in this particular case we should expect a different result these are in equal they are not the same alright so these are the same because I'm looking for equality but if I'm looking at strict equality and I'm not allowing javascript to coerce the integer into a string and then check for equality then I have to say no these are not the same because one is a number and one is a string alright so let me comment that out and let's take do one more check here in this case I'm going to use a different operator the not equal to operator so I'll use the word not unequal and not not equal and not unequal alright which would be the same as saying equal alright so now let's see and run that and this produces a false so this would be returned back and then displayed on screen but then we can also do strict inequality by adding another equal sign to that operator and these are not equal again because it is true that A is not strictly equal to B because they are different data types alright hopefully that makes sense alright so let's go ahead and stop there and hopefully and you're doing great we'll see in the next video thanks in this video we'll talk about iteration statements iterations allow us to loop through a body of code a block of code a number of times until a certain condition is met and there's a couple of different types of iteration statements we'll look at two in this lesson and we'll even look at them in relationship to a raise something I promised several lessons ago so let's start off by creating a new file and call it iterations.js and inside of here we'll create our first for loop so for and then there are three parts inside of the opening and closing parentheses first of all we'll let i equals zero or we can actually just shorthand this and not even use the keyword let and here i less than 10 i plus plus and so this is going to take some explanation let's just get this working first and then I'll come back and I'll talk about it and we'll just print out the value of i alright what do you think is going to happen here if I didn't tell you anything about how the for loop actually works what do you think will be printed the screen when we execute our script let's find out so let's go here and type in node iterations alright so we get several looks like 10 different values printed to screen each on a separate line 0 through 9 and then our application exits alright so let's talk about this it's a shorthand syntax and there's three parts as separated by these two semicolons inside of this this evaluation header for the for first of all we declare variable in this case I've declared i that's why we use the let but then I said we don't really need it let's keep it short so we're declaring it and then we're going to initialize its value to 0 the second step we're going to say continue running this for loop as long as this condition is true so as long as i is less than 10 continue running the body of this for loop as defined with this set of curly braces here and then finally after you run an iteration increment the value of i by 1 and here we're going to then print out the value and that's why we start at the value of 0 and then we work our way all the way through this 10 times on the 10th time i gets incremented to then this check is performed it's false and then we exit out the program now let's do something a little bit more interesting like I suggested before let me kind this out here let's go let a equal to and this should look familiar for 8, 15, 16, 23 and 42 whoops I guess I forgot equal sign there and now what we'll do is for i equals 0 i is less than a dot length i plus plus inside the body of this we'll do console.log a and what element we'll use i because i will start off with the value of 0 and it will continue until we get to the length property which is not 0 based and once we get to for example the 0, 1, 2, 3, 4, 5 so length will be 6 elements so once i is 6 it's no longer true that i is less than the length of this array and we'll exit out so let's go ahead and save this and then run and we can see we get all of our values printed out to screen so that's the proper way to iterate through an array. Now one thing about Visual Studio Code that I really love is that they have this notion of code snippets so if you ever forget this syntax and it can be a little daunting at first there's a way to remember it perfectly every time and that is to let the code snippets build it for you so I type in the 4 key word until a sense pops up a little window under it and I'll use the arrow keys to go to the 4 loop there's a couple of 4s but the one that we want has this little box with dots underneath of it that tells me that this is a code snippet I hit enter on my keyboard and now I get the basic structure of my of my 4 loop already created for the purpose of an array. Now notice that every word index is highlighted and I can change that every instance of that by just using a letter like I'm going to change this to the letter B instead of index and notice that it changed it everywhere and then I'm going to hit the enter key on my keyboard which was the wrong move then I'm going to hit the tab key on my keyboard and I can change the name of the array now. Everywhere the word array is used I can swap that out with the letter A for example tab key one more time here it puts me to another replaceable area for the element and here I'll use C I'll use tab one more time and then it kind of exits me out of that snippet replacement structure and now I can continue on and type like console.log and we'll just print out C ok so let's grab A from our previous example and then we get the same results we got before but this time we didn't have to memorize exactly how to use for the code snippet walked us through and allowed us to replace the names of the various replaceable areas like the name of the counter, the name of the array and the name of the given element C that we extract out of out of our array ok just comment that out that's four and now let's take a look at the while loop so we'll talk about the difference between these it may not be obvious at first but essentially we'll do this alright so take a look at this knowing what you know about loops what do you think is going to happen here well we start off with one and we're going to continue to execute this loop until this condition is false so the very first time we run it one is indeed less than 10 so we'll continue to run the body the block that's associated with our while statement and we'll print out the value of X and then increment its value by one we'll continue to do this until we increment the value of X and it becomes 10 at which point this is no longer true it becomes false and then we'll break out and continue on so let's go ahead and see what value what the value is that we get so we get one through nine that's expected and once we hit 10 we break out great alright so what's the difference between the while statement and this first for loop that we did here at the very top well the difference is that the for loop first of all has a lot of infrastructure that we have to build these three pieces and it uses a series of indexes that represent the number of iterations that will move through this block of code now the while statement is a little bit different anything can be used to drive the iterations as long as this statement continues to be true we'll continue to execute this block of code and so we control the number of iterations in the body in this case here I do the X plus plus now we don't have to use counters we could use anything any kind of business logic like we may want to read to the end of a file and once we hit the end of the file it no longer it makes sense to continue to read each line of the file then we would want to break out so the while is a little bit more flexible and so much that we can build the business logic for how many times we're going to iterate in the body of the the while statement whereas with the for we're pretty much limited to the number of times we want to run this being the number of times that we've kind of preset it up here in this top section outside the body itself okay now there's also one last thing we can talk about and that's a way in both the for and the while we can kind of circumvent this check right here and we may want to do a check like this so if X is equal to 7 then we'll call the break statement alright so learning what we've learned about the if statement it probably should look more like that right so let's first of all let's make sure it works in this case we got 1, 2, 3, 4, 5, 6 once we reach the 7 we circumvent this check and just say hey I want to break out of this alright so we can use that always to break out just like we broke out of the switch when we wanted to not flow through additional cases now the one thing I will say if you notice how I type this to begin with let's retype that so hold on let me comment this out so that you can see it in the code if you want to download my code but we could also do it a little bit more shorter and in line since I only have one statement that I want to make right after the if statement I can do it on the same line and I don't need to surround it with a code block a code block indicates there's usually more than one line of code in this case there's just one line of code I could put it on the separate line and use some indentation like that or I can just keep it all in the same line since it's so short but that might improve readability or I might decide that this is a more readable form that's kind of up to me and if I'm working on it with a team of software developers I might want to get and kind of do it the way that they do if it's stylistic for me this is so short I can read it all one shot if x is 7 then break out of it it just it looks good it's very readable I'll be able to understand what I'm doing later on it doesn't take up and move the code down so I like that that format if I just need to create one statement right after my if right after my if so sometimes it makes sense to split things on separate lines sometimes it makes sense to keep two different statements in the same line again I think it kind of is a stylistic choice that you'll you have to make for yourself at some point alright so that is iteration statements we looked at two different kinds and we looked at how code snippets can be used to help us remember the format now I believe the while has in fact I believe most of the things that we've looked at has some some code snippets available like if I find it here in Intellisense enter on the keyboard but there's not as much to it there I mean while with the condition I can change this to x is less than 10 right it's not so much for me to type that out but the four makes a little bit more sense because there's so many parts to it and replaceable parts of that okay so let's continue on the next video we'll see there thanks it seems like quite a while ago we talked about variables but now that we're working with blocks of code inside of blocks of code like we had here in lines number 23 and then 29 through 31 we need to talk about variable scope and when I use the term scope I mean variables are a little bit like people in so much that variables have a lifespan they're born they do work and then they die and they're removed from computers memory when they go out of scope and we'll see an example of that in just a moment but they're also like people in so much that they have a citizenship I guess you can say in other words depending on where they were born they can work inside of some code blocks but not other code blocks and so the remainder of this video we're going to look at lifetime and availability or citizenship I guess you can say inside of the rest of your application so let me create a new file and we're going to call this scope basics and there will be more to say about scope as we move forward and learn more about functions and so on in just a little while here but let's start and create first example here so let equals first then I'm going to create a function called scope test and inside here I'll just do a console.log and the first thing I want to see is if I declare variable out here outside of my function can I reference it inside of my function and so to find out let's just call scope test and see what we get so here we're going to type node scope basics and we can in fact view the value of a variable that was declared outside of the scope of a function we can view it inside of the scope of that function so the next thing that I want to do is to say hey let's create a variable here now if I create a variable inside of a function scope can I view it out here outside of the function scope so console.log B and let's see and so no not only can I not see it but my application actually blows up and you can see the little carrot here is right underneath the B and it says B is not defined so in other words you can kind of think of it again in terms of the lifespan we created a function created a variable inside of that function that variable lives as long as that function is running but after the function after that code block has completed executing then B is removed from the computer's memory and essentially thrown away therefore we cannot reference that variable outside of the function because it no longer lives it's dead alright so we're going to have to comment that out and we can go ahead and comment this out as well now let's do one more thing here let's say if A and we'll just do something silly here if it's not equal to an empty string so just two single quote marks next to each other so then can we still see the value of A even inside this innermost block of code that we defined with an if statement if we can we should see then it printed here a second time the value first so let's say what we have let's run this again and so we see first first the first time is printed out and the second time that is printed out alright so yes if something is declared in an outside scope it is visible or it can, it has citizenship in every inner scope from that point on but here once again if we were to create a variable third and then try to reference it outside of the code block in which it was defined like so will this work what do you think we're gonna get that same kind of error before we get the little arrow pointing to the C and it says that C is not defined the variable C was defined inside of this code block and once we executed that code block and got to the end of it then C was removed from the computer's memory it's no longer available to us in a sense dies and it's no longer available okay now let's just do one last thing here just to kind of understand that we are in fact able to work with the variable that was defined in the outermost scope can we still work with it use it and change its value so I'm gonna change this to changed and then I'm going to reference it here console.log a and so now let's run our application one more time alright so the first time that it's run this first console.log it will be the value first then we change the value and we log it again and that's where the second change comes from after we've executed that function then we execute line 20 and that's where this third changed appears alright so I guess the moral of the story once again to kind of reiterate what we said when you declare a variable you have to understand in which scope it was defined because based on the scope or rather the code block in which that variable is defined it's going to have a lifespan and it's going to have citizenship if it was defined in the outermost scope it will have its life and its citizenship in all interscopes but if it's defined in an intermost scope it will not be available to outerscopes now one last thing and I'll kind of end it right here we were to take and this is probably just a question for you just thought question if I define b here right above that if statement and then I attempt to use it right here and call this inside if do you think that we'll be able to reference that value well based on what we know about the rules I would expect to see the value second printed out so let's try it and in fact we do see it so hopefully that supports your new understanding of the scope of variables defining them outside of a code block versus defining them inside of a code block and trying to reference them outside ok so hopefully that all makes sense we want to make sure you're clear on that we're going to revisit the topic of scope because there's a lot more to this but this is your first introduction so that you kind of understand what the rules of scope are at least in the most basic sense alright so we'll continue on the next video see you there thanks for the topic that we'll keep coming back to over and over throughout this course it's important because at least when your javascript is run inside of a web browser you must be aware of the top most level of scope which is referred to as global scope in node like we're using here it's not as much of an issue they've got some safeguards against it but in web development working against the global scope is a crucial concern a lot of consternation and consequently a lot of effort has been exerted to preach that declaring variables at the global scope is a bad idea so you would never want to do something let me create a new file here returning functions.js js there we go you never want to do something like this note the use of the var keyword and you never want to do something like this although you're more likely to do it than the previous line in line number one now the reasons why you would never want to do that this will require a little bit more explanation a little bit down the road and I'll make this point emphatically when we start writing javascript for the web browser later on in this course but for now just understand that much of what I'll say and why I say it over the course of the next 5 or 6 lessons or so we'll be working towards a solution to avoid writing your code in the global scope if at all possible now the eventual solution that I want to demonstrate relies on how javascript functions work but we need to take a few baby steps to get there so the first aspect of this technique that I want to demonstrate has to do with returning a function from a function now up until now our functions perform one or more actions and then exited quietly we may have returned a simple value like true or high or something along those lines however we can create functions that can not only perform some action but then at the very end can return a value to the caller and not just any value can return a function so let me comment all this stuff out and I'll say don't do this to make sure you never do that and this either and then I'll just do a multi-line comment here and so let's start off really simple this is something that we've already talked about when we talked about declaring functions or function declarations so here's function 1 let's return the string 1 it's not very exciting but it demonstrates the point that you can use the return keyword to return a value to whatever calls that so for example let value equals 1 for example and what would we expect to be in our variable value well we would expect to print out the string O and E or 1 so console.log and value like so and just to see this working let's go ahead say node and then returning functions and we see it returns here at the bottom of our screen the string 1 as we hoped now we could also kind of paraphrase this make this a little simpler by just doing it all in one line right so we could put the call to the function and not use a variable call to the function which returns a string and that returned value will automatically be passed into the console.log method let's save that hopefully that makes sense and that's a common technique that we'll want to use but things start to get a little bit more mind bending when you start to think of a function as just another data type in javascript so for example let's go back to this I'm going to copy this again and then let's go to console.log and then type of value and well let's do this let's get rid of the method invocation operator so now we're just setting a reference called value to our function 1 let's see what we get and you can see the type is function so let's think about all the data types we know about now we know about string we know about number we know about boolean we know about undefined and we know about function right and we're going to learn a couple more before this is all said and done but at any rate notice here again I'm just in fact we could even do this a little bit differently I may have muddied the waters by introducing a variable let's just do that instead and we should get the same the same result so I guess the heart of the matter here is that we can get a reference to a function and we can store that reference to the function out in a variable which means we could also do something like this so now we have a reference to the function we can call the function using the method invocation or the function invocation operator so let's go ahead and run it I guess we need to actually then go console.log there we go now we're getting somewhere there we go okay so hopefully that makes sense I just have a variable pointing to the function and then now that I have a variable pointing to the function I can execute the function by just using that variable with our method invocation operator right alright hopefully you're still with me so far hopefully this isn't too mind bending let's continue on here so since a function is just a data type like any other data type that we've learned about so far our functions could return a function because we're just returning a value and that value can be any type so in other words let's do this function2 and here we're going to return a function now this is a function expression inside of a function declaration right and here console.log and 2 and then do something like let my function equal to now what gets returned to my function it'll be this enter function expression so I should be able to do something like my function with the method invocation operators and let's see what we get and we get the value 2 like we'd hoped alright so hopefully you can see here we're using the return keyword to return a function expression we get a reference to that function expression by calling the outer function declaration now we have a function in hand or reference to that function this inner function right here and we merely invoke it hopefully all that makes sense and we might be able to do this a little bit differently let's try just a slightly different tact so here I'm going to go function 3 and here I'm going to return function and then return 3 alright let me spell return correctly alright so in this case I'm returning a function that returns a string so I should be able to do something like console.log and then I'm going to call 3 what do I get back from that I should get back a function so I should be able to invoke that function to get back the string to get to the console.log now you would never do this and you would never see this but this is just to illustrate a point that of what you're really working with and that's references let's actually execute it there we go 3 what you're working with here are references to functions that can return references to other things and maybe even other functions right so again that last one is pretty far fetched you probably never do that but the fact is that what gets returned from our 3 function declaration is a function and then it can be invoked with the function invocation operator here the second set of inner parentheses right there so on the surface this might not seem like a very significant development in our javascript journey but nothing actually could be further from the truth because this is actually a huge step towards moving our code out of the global namespace like I talked about at the beginning of this video but to complete this story again we have several more baby steps to go we're going to need to step away from functions for a little bit and come back to them once we've learned