In the three-minute introduction, I'm going to answer four frequently asked questions about JavaScript. What is JavaScript? What can you do with it?
Where does JavaScript code run? And what is the difference between JavaScript and ECMAScript? So let's start with the first question. What is JavaScript? JavaScript is one of the most popular and widely used programming languages in the world right now.
It's growing faster than any other programming languages and big companies like Netflix, Walmart, and PayPal build internal applications around JavaScript. And here's the average salary of a JavaScript developer in the United States. that is $72,000 a year.
So it's a great opportunity to get a good job out of learning JavaScript. You can work as a front-end developer or a backend developer or a full-stack developer, who knows both the front-end and the backend. Now the second question, what can you do with JavaScript? For a long time, JavaScript was only used in browsers to build interactive web pages.
Some developers refer to JavaScript as a toy language. But those days are gone because of huge community support and investments by large companies like Facebook and Google. These days you can build full-blown web or mobile apps as well as real-time networking applications like chats and video streaming services, command line tools, or even games. Here's an example. The third question, where does JavaScript code run?
JavaScript was originally designed to run only in browsers. So every browser has what we call a JavaScript engine that can execute JavaScript code. For example, the JavaScript engines in Firefox and Chrome are SpiderMonkey and V8.
In 2009, a very clever engineer called Ryan Dahl took the open source JavaScript engine in Chrome and embedded it inside a C++ program. He called that program Node. So Node is a C++ program that includes Google's V8 JavaScript engine. Now with this, we can run JavaScript code outside of a browser.
So we can pass our JavaScript code to Node for execution. And this means with JavaScript, we can build the backend for our web and mobile applications. So in a nutshell, JavaScript code can be run inside of a browser or in Node. Browsers and and Node provide a runtime environment for our JavaScript code.
And finally, the last question, what is the difference between JavaScript and ECMAScript? Well, ECMAScript is just a specification. JavaScript is a programming language that confirms to this specification.
So we have this organization called ECMA, which is responsible for defining standards. They take care of this ECMAScript specification. The first version of ECMAScript was released in 1997. Then starting from 2015, ECMO has been working on annual releases of a new specification. So in 2015, they released ECMAScript 2015, which is also called ECMAScript version 6 or ES6 for short.
This specification defined many new features for JavaScript. All right, enough theory. Let's see JavaScript in action.
So every browser has a JavaScript engine, and we can easily write JavaScript code here without... any additional tools. Of course, this is not how we build real world applications, but this is just for a quick demo.
So open up Chrome, right click on an empty area and go to inspect. Now this opens up Chrome developer tools. Here, select the console tab. This is our JavaScript console and we can write any valid JavaScript code here. So type this console.log put a single code here and then hello.
world another single code to terminate close the parentheses and at a semicolon at the end now as you go through the course you're going To understand exactly what all this means for now. Don't worry about it So now press enter and you can see the hello world message on the console. We can also write Mathematical expressions here.
For example 2 plus 2 we get 4 or we can do something like this alert parentheses single code yo Enter and here's an alert in the next lecture. I'm going to talk about setting up your development environment for writing JavaScript code In order to write JavaScript code you need a code editor There are various code editors out there including Visual Studio code or VS code sublime text atom and so on out of these My favorite is Visual Studio Code that you can download from code.visualstudio.com. It's a very simple, lightweight, cross-platform, and powerful editor. So if you don't have Visual Studio Code on your machine, go ahead and download it.
The other thing I want you to install is Node. You can download Node from Node.js.org. Now, technically, you don't necessarily need Node to execute JavaScript.
Because as I explained before, you can execute JavaScript code inside of a browser or in Node. But it's good to have Node on your machine because we use that to install third-party libraries. And also, later in this section, I'm going to show you a preview of Node. So, pause the video now.
Download visual studio code as well as note once you're done come back continue watching All right. Now I want you to create a new folder call that Js-Basics the name doesn't really matter We just want to have a folder for writing all the code in this course now drag and drop this folder into visual studio code Okay, we've got this folder open Let's add a new file here, index.html. Now, you don't really need to know HTML in order to take this course, but if you want to be a front-end developer, you should know your HTML well.
Now, in this file, I want you to type an exclamation mark and then press tab. This generates some basic HTML boilerplate. We don't really care about any of this code here. We're going to use this as a host for our JavaScript code. You're going to see that in the next lecture.
Save the changes now open the extensions tab here here in this box search for live Server so live server is a very lightweight web server that we're going to use to serve our web application So install this then you will have to restart Visual Studio code when you're done go to the Explorer tab right-click index.html select open with live server this will open up Chrome or your default browser and point it to this address that's where our web application is served from now currently we have an empty page now to make sure that everything is working properly let's go back to Visual Studio code here in the body section let's add an h1 press tab and type hello world Now save the changes back in the browser. We can see this page is refreshed automatically. And we've got the hello world heading here.
In the next lecture, you're going to write your first JavaScript code. All right, now we're ready to write our first JavaScript code. In order to write JavaScript code here, we need a script element. There are two places where we can add a script element. we can add that here in the head section or in the body section the best practice is to put the script element at the end of the body section after all the existing elements so here after h1 i'm going to type script and press tab this is our script element now why did i say that as a best practice you should put the script element here well there are two reasons for that one reason that the browser parses this file from top to bottom so if you put the script element here in the head section you might have a lot of JavaScript code there so your browser may get busy parsing and executing that JavaScript code and it won't be able to render the content of the page so this will create a bad user experience your user looks at your web page it's white or blank while your browser is busy parsing and executing your JavaScript code.
So that's reason one. The second reason is that almost always the code that we have in between script elements needs to talk to the elements on this webpage. For example, we may want to show or hide some elements.
So by adding the code here at the end of the body section, we'll be confident that all these elements are rendered by the browser. Now there are exceptions to this rule Sometimes you're using third-party code that has to be placed in the head section But these are exceptions as I told you before as a best practice You should add your JavaScript code at the end of the body section now here We're gonna write the same code that you wrote in the last lecture console dot log Hello world, but we're going to talk about this in a little bit more detail. What we have here is a statement A statement is a piece of code that expresses an action to be carried out.
In this case, we want to log a message on the console. statements in JavaScript should be terminated by a semicolon what we have here in between single quotes is called a string a string is a sequence of characters now in JavaScript we also have this notation we can add two slashes and this represents a comment so here we can add some description to our code and this description is ignored by the JavaScript engine it's not executed It's purely for documenting the code when you want to explain to other developers why you have written this code this way You don't want to explain what the code does because that should be clear in the code itself So here I don't want to write something like logging something on the console. That's so obvious in the code, right? Instead we want to explain why's and how's so for this demo. I'm just gonna add a simple comment.
This is my first JavaScript code Now save the changes back in the browser. We need to bring the console back up. So right click somewhere and go to inspect.
Or alternatively, you can use a shortcut that is alt command and I on Mac or alt control I on Windows. That brings up the console tab. If the console tab is not immediately visible, make sure to select it here.
And here you can see the hello world message. Now while we can easily write JavaScript code in between the script element in a real world application We have thousands or even million lines of code. We don't want to write all that code in line here We want to extract and separate our JavaScript code from our HTML code Let me give you a metaphor think of your house in your bedroom. You have your bed and your clothes You don't store your clothes in the kitchen. This is what we call separation of concerns.
We have the same principle in programming So we want to separate HTML which is all about content from JavaScript, which is all about behavior How should your web page behave what should happen when we hover our mouse over a given element? Maybe something should pop up. Maybe something should be hidden. So we use JavaScript to implement behavior So open up the Explorer window add a new file call it index Js now back in index.html cut all this javascript code here and then paste it in index.js now in this simple application we have a single file a single javascript file in a real world application we have hundreds or even thousands of javascript files later in the course you will learn how to combine these files into a bundle and serve that bundle to the client now save the changes back in index.html now that all our javascript code is in a separate file We need to reference that file here. So let's add an attribute here SRC, which is short for source and set it to index.js.
So this tells the browser that our JavaScript code is now in index.js. Save the changes back in the browser. You can still see the hello world message and that confirms that our code is still working. In the next lecture, we're going to execute this code in node. So in the last lecture, we executed this piece of JavaScript code inside of a browser.
In this lecture, I'm going to show you how to run the same code in Node. So I'm assuming that you have installed Node on your machine. If not, head over to Node.js.org and download the latest version of Node.
Now, if you're on Windows, open up command prompt. If you're on Mac, open up terminal and head over to the folder you created earlier. Now in this folder, we run Node and pass the name of our JavaScript file that is index dot JS we get the same message on the console So you can see node is a program that includes Google's v8 JavaScript engine we can give it a piece of JavaScript code and it will execute that code for us Just like how we can execute some JavaScript code in a browser So node is a runtime environment for executing JavaScript code. Now. Let me show you a tip here in vs code We have an integrated terminal So you don't have to explicitly open up a separate terminal window.
So here on the top under the View menu, look we have integrated terminal. Note the shortcut here. That's the shortcut for Mac. On Windows you're gonna have a different shortcut. So select this and here's our integrated terminal pointing to the same folder.
where we created our files so you don't have to explicitly navigate to this folder and here we can run node Index.js as well now in this course We're not going to work with node anymore because node is a completely separate topic In fact, I have a comprehensive course about node with 14 hours of content So once you finish this course, if you want to learn node, you can always look at my node course. Well, hello, it's mosh here Thank you for watching my JavaScript tutorial. I just wanted to quickly let you know that this tutorial is part of my complete JavaScript course where you can learn about all the essential concepts in JavaScript.
The course is packed with lots of exercises and solutions. And by the end of watching the course, you will also receive a certificate of completion. In case you're interested, you can find the link in the video description.
And if not, that's perfectly fine. Continue watching as the next section is coming up. Let's start this section by a discussion of variables which are one of the most fundamental concepts in JavaScript and any other programming languages.
In programming we use a variable to store data temporarily in a computer's memory. So we store our data somewhere and give that memory location a name and with this name We can read the data at the given location in the future. Here's a metaphor. Think of the boxes you use to organize your stuff.
You put your stuff in various boxes and put a label on each box. With this, you can easily find your stuff. right a variable is like a box what we put inside the box is the value that we assign to a variable that's the data and the label that we put on the box is the name of our variable now let's see this in code so here in index.js i'm going to declare a variable now previously in the old days before es6 we use the var keyword to declare a variable but there are issues with var as you will find out later in the course so Going forward from ES6, the best practice is to use the let keyword to declare a variable.
Now, we need to give this variable a name or an identifier. And this is like the label we put on a box. So I'm going to call this name. And finally, we need to terminate this declaration with a semicolon.
Now let's log this on the console and see what we get. So console.log name. Once again, we need to terminate this statement. with a semicolon save the changes and here in the console we see undefined so by default variables that we define in JavaScript their value is undefined now we can optionally initialize this variable so I'm gonna set this to a string which is a sequence of characters like Marsh note that I'm using single quotes you can also use double quotes different developers have different preferences But it's more common to use single quotes for declaring strings in JavaScript now when we save the changes Instead of undefined we see mosh on the console So here in this example We have declared a variable called name and we have set that to this value to this string now We have a few rules for naming these variables.
Here are the rules first is that they cannot be a reserved keyword So in JavaScript, we have reserved keywords. Let is one of them. You also have if else var and so on.
Now you don't have to memorize this list. If you try to use one of these names, you're going to get an error. For example, if I change this to if not this red on the line, this is indicating that this is not a valid identifier. Okay, so revert it back.
Now the second rule is that they should be meaningful. We want to have meaningful names like meaningful labels. I've seen developers Using names like a or B or a 1 or I don't know X these variable names do not give us any clue What is the purpose of these variables? What kind of data are we storing at that memory location? So always use meaningful and descriptive names Okay.
Now back to name. The third rule is that they cannot start with a number so we cannot have a variable like one name but again going back to the second rule why would you want to call a variable one name it's meaningless right so always use meaningful names the fourth rule is that they cannot contain a space or hyphen so if you have multiple words you need to put them together here's an example let's imagine we want to declare a variable called first name so first name and note that here I'm using camel notation so the first letter of the first word should be lowercase and the first letter of every word after should be uppercase this is what we call camel notation which is the convention we use in JavaScript to name our variables another thing you need to know about these variable names is that they are case sensitive so if I declare Another variable call it first name, but make the F uppercase These two variables are different but as I told you before if you stick to camel notation you wouldn't end up with a variable name like this and Finally the last thing you need to know about these variables is that if you want to declare multiple variables There are two ways to do this You can declare them on one line and separate them using a comma. So first name and then last name Now in this case, I have not initialized either of these variables, they're both undefined, I can optionally initialize one or both of them.
So I can set this to mosh. And I can leave last name undefined or set it to my last name have a dining. But the modern best practice is to declare each variable on a single line.
So we terminate this first declaration with a semicolon and declared the second variable on a new line. That's the modern best practice. Next, we're going to look at constants.
All right, now let's declare a variable called interest rate. So let interest rate, and we set this to point three. Now this is the initial value, we can always change that later.
So we can set interest rate to let's say one. Now if you log this on the console, of course, we're going to see the new value, right? So save the changes. And here's one on the console.
However, in a real world application, there are situations that we don't want the value of a variable to change, because otherwise, it's going to create all kinds of bugs in our application. In those situations, instead of a variable, we use a constant. So the value of a variable as the name implies can change.
but the value of a constant cannot change. So here, if we change let to const, now interest rate will be a constant. So when I save the changes, you're going to see an error in the console on line three, where we reassign interest rate.
So let's have a look, save the changes. And here's the error on cot type error assignment to constant variable. you can see this error happen in index.js line three, if you click here, you can see the line in code where this error occurred.
So we cannot reassign a constant. Alright, now back to the console. So here's the best practice. If you don't need to reassign constant should be your default choice. Otherwise, if you need to reassign a variable use let So you have learned how to declare and initialize a variable now you might be wondering what are the kind of values?
That we can assign to a variable. Well, you have seen strings, but we have more types Basically in JavaScript we have two categories of types on one side We have primitives also called value types and the other types we have Reference types in this lecture. We're going to focus on primitives and you're going to learn about Reference types later in the course now in the category of primitives we have strings numbers Boolean undefined and not let's look at each of these in action So here we have a variable called name which is set to a string what we have here is what we call a string Literal, that's just a fancy name for a string now.
Let's declare a variable and set it to a number. So let age, we set that to 30. And by the way, I'm not 30 years old, but don't tell anyone. Okay.
So this is what we call a number literal. Now let's declare a Boolean. A Boolean can be either true or false.
So let is approved to be true. This is what we call a Boolean literal. And we use this in situations where we want to have some logic.
For example, If the order is approved, then it needs to be shipped. So the value of a Boolean variable can be true or false. And by the way, note that both true and false are reserved keywords, so they cannot be variable names.
Okay? Now you have seen undefined before, so I can declare another variable, first name. If we don't initialize it, by default, its value is undefined. But we can also explicitly set this to undefined.
but that's not very common. In contrast, we have another keyword that is not so let me declare another variable and set this to not we use null in situations where we want to explicitly clear the value of a variable. For example, we may want to present the user with a list of colors. If the user has no selection, we want to set the selected color variable to know in the future if the user selects a color then we're going to reassign this variable to a color like red and then if they click red again perhaps we want to remove the selection so we set this back to no so we use null in situations where we want to clear the value of a variable so these are the examples of primitives or value types we have strings numbers booleans undefined and not Now in ES6 we have another primitive that is symbol and you're going to learn about that later in the course. One thing that separates JavaScript from a lot of programming languages is that JavaScript is a dynamic language.
What do I mean by dynamic? Well, we have two types of programming languages, static languages or dynamic languages. In static languages, when we declare a variable the type of that variable is set and it cannot be changed in the future in a dynamic language like javascript the type of a variable can change at runtime let's see this in code so back in the example from the last lecture we have declared this name variable and we have set that to a string so the type of name is currently a string but it can change in the future let's take a look so here in the console we can execute some javascript code We have this type of operator, and with that we can check the type of a variable. So after that, we add the name of the variable, in this case, our name variable. So note that the type of name is a string.
Now, if we reassign name to a different value, like a number, and check its type, look, the type is now changed to a number. This is what we call a dynamic language. So unlike static languages the type of these variables will be determined at runtime based on the values that we assign to them Now let's take a look at a few more examples of the type of operator And by the way note that type of is another reserved keyword So you cannot have a variable called type of so we can clear the console by pressing ctrl and L So now let's take a look at type of age. It's a number Now if we change age to a floating point number, and I know it doesn't make sense But let's just stick to this for this example 30.1 and then look at type of age. It's still a number So in JavaScript unlike other programming languages, we don't have two kinds of numbers We don't have floating point numbers and integers all numbers are of type number now.
Let's look at the type of is approved It's a boolean as I told you before what about the first name? Let's have a look type of first name It's undefined and that's funny because the value of this variable is undefined but its type is also undefined What does this mean? Well earlier I told you that we have two categories of types We have primitives or value types and reference types in the primitive types category. We have strings numbers booleans undefined and no so undefined is actually a type but is also a value in this example because we have set first name to undefined as a value its type is also undefined okay now what about selected color let's have a look so type of selected color the type of this variable is an object what is an object that's the topic for the next lecture so you have seen all the primitive types in JavaScript now let's take a look at the reference types in the reference types category we have objects arrays and functions in this lecture we're going to explore objects and you will learn about arrays and functions later in the section so what is an object an object in JavaScript and other programming languages is like an object in real life think of a person a person name age address and so on these are the properties of a person you have the same concept in JavaScript so when we're dealing with multiple related variables we can put these variables inside of an object for example here we have two variables name and age they're highly related they are part of the representation of a person so instead of declaring two variables we can declare a particular variable Person object and then instead of referencing these two different variables we can just reference the person object It makes our code cleaner So let's see how we can declare a person object we start with let or const if we don't want to reassign the person object And set it to an object literal so this syntax we have here these curly braces is what we call an object literal now Between these curly braces we add one or more key value pairs So the keys are what we call the properties of this object in this case We want this person object to have two properties or two keys name and age so we add name here, that's the key then we add a colon and After that we set the value so mosh now we add a comma and add another key value pair 30 so now we have a person object with two properties or two key value pairs name and Age and with that we don't need these two Variables now this log person on the console so console dot log Person save the changes.
So here's our personal object again note the object literal syntax so we have curly braces and in between them we have One or more key value pairs and these are the properties of the personal object now There are two ways to work with these properties. Let's say we want to change the name of this person So we need to access the name property. There are two ways. The first way is what we call the dot notation So we add the name of our object in this case person dot now you can see its properties. We have age and name So we can change the value of name to John.
Now we can use the dot notation to also read the value of a property. So here on line 10, instead of logging the person object, we can log its name property, save the changes. And in the console, we get John. The other way to access a property is using bracket notation.
So bracket notation so instead of dot we use square brackets and we pass a string that determines the name of the target property so single or double quotes but single quotes are more common the name of the target property is name so we can change that to let's say Mary again when reading that we can use the dot notation or the bracket notation if we save the changes now we get Mary on the console Now you might be asking, which approach is better dot notation or bracket notation? Well, as you can see, dot notation is a bit more concise, it's shorter. So that should be your default choice. However, bracket notation has its own uses. Sometimes you don't know the name of the target property until the runtime.
For example, in our user interface, the user might be selecting the name of the target property. In that case, the time of writing code we don't know what property we're going to access that is going to be selected at runtime by the user so we might have another variable somewhere else like selection that determines the name of the target property that the user is selecting and that can change at runtime with this we can access that property using the bracket notation in a dynamic way so we pass selection here and we get the same result Okay, now if this is confusing, don't worry, you're going to see this again in the future as you gain more experience with JavaScript. For now, just stick to the dot notation because that's cleaner and easier.
Next, we're going to look at arrays. Sometimes in your applications, you might be dealing with a list of objects. For example, the list of products in a shopping cart. the list of colors the user has selected in situations like that you use an array to store that list let me show you how so here I'm gonna declare another variable called selected colors note that I'm using a meaningful name I don't have SC or some other weird name selected colors now we can initialize this and set it to an empty array so these square brackets are what we call array literal and they indicate an empty array now we can initialize this array and add a couple of items like red and blue let's lock this on the console so console the log selected colors save the changes so here's our array with two elements we can expand that note that each element has an index and that determines the position of that element in the array so the index of the first element is 0 and the index of the second element is 1 so if you want to access an element in an array we use this index here's how for example let's say you want to display the first element in this array you use the square brackets and then specify the index save the changes and now we have red now earlier I told you that JavaScript is a dynamic language So the type of variables can change at runtime the same principle applies to our arrays So the lengths of arrays as well as the type of objects we have in an array are dynamic They can change so online to we initialize this array with two elements, right now online three We can add another element to this array. So the array will expand so let's say selected colors of two That means the third item in this array is going to be green.
Now, let's display this array on the console. So we have an array with three elements. So the length is dynamic, it can change.
Also, the type of objects we have in this array is dynamic. So unlike other programming languages, where every item or every object in the array should have the same type. In JavaScript, we can store different types in an array. So we can make the last element a number save the changes now We have two strings and a number so the objects in the array as well as the size of the array are dynamic now Technically an array is an object So just like the personal object with defined in the last lecture It has a bunch of key value pairs or properties that we can access using the dot notation Let me prove that to you.
So here on the console. Let's look at the type of selected colors. So the type of this array is an object. So an array is an object in JavaScript. So here on line four, we can look at the properties of this array or this object using the dot notation.
Look, these are all the properties defined in arrays in JavaScript. So every time we declare an array using square brackets, that array will automatically receive these properties. We didn't explicitly define them. They're just somehow magically Inherited from somewhere else you're going to learn about that later when we talk about prototypes now in this lecture We're going to look at one of these properties that is the length Property this property returns the number of items or elements in an array So save the changes you can see we have three elements in this array now later in the course We have a comprehensive section about arrays. You will learn about all kinds of operations.
You can perform arrays for now all I want you to take away is that an array is a data structure that we use to represent a list of items in the category of reference types you have learned about objects and arrays now let's take a look at functions functions are one of the fundamental building blocks in JavaScript a function is basically a set of statements that performs a task or calculates a value. Let me show you a couple of examples. So I'm gonna declare a function using the function keyword now We need to give it a name.
Let's call that greet after that. We need to add Parentheses that's part of the syntax for declaring functions and then curly braces Now what we have here inside the curly braces is what we refer to as the body of this function And this is where we add all the statements to define some kind of logic in our application example the logic for this function should be to display a message on the console so here we can add console the log hello world now note that here we have a statement so we terminate it with a semicolon but when we are declaring a function we don't need to add semicolon at the end because we are not declaring it like a variable like this okay this is a function declaration right so now we have a function we can call this function like this so we add the name of the function and parentheses again and then semicolon to indicate that this is a statement save the changes now we have hello world on the console but that's pretty boring what would we do this let me show you how to make this more interesting our functions can have inputs and these inputs can change how the function behaves so let's say instead of displaying hello world we want to display the name of the person here like hello john so we can add a variable here in between parentheses we refer to this variable as a parameter so this grid function has one parameter called name and essentially name is like a variable that is only meaningful inside of this function so inside of this function we can work with this name variable but it will not be accessible outside of this function. Now name is an input to this function.
So instead of displaying hello world we can display hello, then add a plus here to concatenate two strings. So we can add name after. Now when calling the grid function, we need to pass a value for the name variable or name parameter more accurately.
So we can pass John here now we refer to this as an argument so John is an argument to the great function and name is a Parameter of the great function. That's one of the things that a lot of programmers don't know They don't know the difference between a parameter and an argument So a parameter is what we have here at the time of declaration But the argument is the actual value with supply for that parameter. Okay now let's save the changes so we have hello john now we can reuse this function but with a different input so we can copy this line here and change john to mary save the changes now we have two different messages on the console now a function can have multiple parameters so here we can separate parameters using a comma so let's add another parameter like last name now we can change our console.log add a space here and then display the last name now when calling this great function we should pass another argument for the last name right but let's see what happens if we don't do this so I'm gonna save the changes see what we got hello John undefined because as I told you before the default value of variables in JavaScript is undefined so because we did not pass a value for the last name by default it's undefined so i'm going to pass another argument here we separate them using a comma john smith and we don't need the second call to the greet function save the changes now we have hello john smith Now there is a cleaner way to write this code on line 3. All these concatenations are kind of ugly, they're getting in the way.
Later in the course I'll show you how to use template literals to clean up this code. For now, don't worry about it. Let's look at another example of a function.
So this function we have here is performing a task. So performing a task. This task is to display something on the console. But sometimes our functions might calculate something.
So here is an example of a function that calculates a value so again function let's call this function square this function should take a parameter let's call that number now we need to calculate the square of that number that is number times number just basic math right now we need to return this value to whoever is calling this function for that we use the return keyword that's another reserved keyword so you cannot have a variable called return okay now instead of calling the great function let's call the square function so square we pass 2 now this returns a value so we can use that value to initialize a variable for example we can declare another variable called number and set it to a square of 2 and then we can display that on the console Save the changes so we get four now in this particular example We don't necessarily have to declare a separate variable if all we want to do is to display The square of two on the console we can exclude this variable declaration and simply pass Square of two to console dot log. So when the JavaScript engine Executes this code First is going to call this function. It would get a value and then pass that value to console dot log Let's save the changes and look we still get four now.
I have a question for you How many function calls do you think we have in this code? We have two function calls square of two is one function call Let me delete this temporarily but console dot log is also another function call right because here we have Parentheses so we're calling the log function which is defined somewhere and passing an argument We can pass a simple string like hello Or we can pass an expression that expression can be a call to another function like square of two Okay, so this is the basics of functions again later in the course We have a comprehensive section about functions for now all I want you to take away is that a function is a set of statements that either performs a task or calculates and returns a value a real world application is essentially a collection of hundreds or thousands of functions working together to provide the functionality of that application hi there it's me Masha again you seem to be very enthusiastic about learning JavaScript so I want to congratulate you for your determination for learning if you want to learn more from me I highly encourage you to enroll in my JavaScript course. You can watch this course online or offline as many times as you want at your own pace. The course comes with plenty of exercises and solutions, and you will also receive a certificate of completion by the end of watching the course. In case you're interested, the link is in the video description.
Have a great day, and I hope to see you in the course.