Learn JavaScript in 60 Minutes | JavaScript Crash Course | JavaScript Tutorial | Edureka

Learn JavaScript in 60 Minutes | JavaScript Crash Course | JavaScript Tutorial | Edureka

Show Video

Netscape. Communications, had, division, that the web needed, a way to become more dynamic now, they wanted animations, interaction. And other forms, of small automation. As part, of the web of the future now, the goal was to seek ways to expand, the web and that, is exactly what, gave, birth to JavaScript. Hi, everyone, this is shine Tony from Abe Eureka, and in today's session we will see how you can learn JavaScript. In 60 minutes. So. Now before starting with today's session, let's have a quick look at the agenda so. Now in today's session I will be answering, some of the most commonly, asked, questions, about JavaScript. So, first we will start with what is JavaScript. And then, I'll tell you about what, JavaScript. Can do and then, we will move on and see where does the code run and finally, we will have a look at the different benefits, of JavaScript. Moving, on we will also see the setting up of the development, environment or, how the IDE, is used here and finally. I will show you some of the fundamentals, of JavaScript. Which will help you learn how to write any code in JavaScript. Now. Before we start answering, all these questions don't. Forget to subscribe to Eddie rakers youtube channel, to stay connected with the latest technologies. So. Let's get started, so what is JavaScript. Now, javascript, is basically, a high-level, interpreted. Programming, language, which, is used to make webpages more. Interactive. Now. It all started, in the year 1995. When Brent and I created, JavaScript, in a span of 10 days since, then it has seen multiple versions, updates, and has grown to the next level, now, javascript, is basically, the language of the web so it is used to make the web look alive by adding, motion to it not, to be more precise, it is a programming. Language that. Lets you implement, complex, and beautiful, things or design. On webpages. Now. Let's move on and see what, can javascript, do so. Basically, there are a lot of queries, about why do we need JavaScript. And what it can do when we have HTML, and CSS already. But. JavaScript, as a language, helps you build a website that. Will do a lot more than just gawk, at you now.

Currently, We have hundreds, of programming, languages, and every day new languages, are being created, now among, these are few powerful languages. That bring about big changes in, the market, and javascript. Is definitely. One of them, now, javascript, has always been, on the list of popular, programming, languages, according, to Stack Overflow for, the sixth year in a row JavaScript. Has remained, the most popular, and commonly, used programming, language, now. Moving on to what this programming, language can actually, do we, see that javascript. Is mainly known for creating beautiful. Web pages and applications. Now, an example, of this is also the Google Maps so, if you want to explore a specific, map all you have to do is click and drag with the mouse and what, sort of language could do that of, course is JavaScript. Now, this language is also used in smartwatches, now. The popular, SmartWatch, maker pebble, created, pebble dot j/s which is a small javascript, framework, that, allows the developer, to create an application, for the pebble line of watches in JavaScript. Not. Just that the most popular, websites, like Google Facebook Netflix, Amazon, etc. Make, use of JavaScript, to build their websites, now, among things like mobile applications. Digital art web servers, and server applications. Javascript. Is also used to make games a lot, of developers, are building small scale games and apps using, javascript. Now. A lot of people ask about where, to run the JavaScript code, now. When it comes to running the JavaScript, code you can use the console, which is pretty simple because you can just type, whatever, you want to do with your code and you will see the output here itself, or you can use any text editor for example I, will be using the, you do code and show you how you can write your code here and then. How you can run it in your website and see how it works so, you can work it both ways you can enter any data or input, here and then you can go back to your console, and check your output, also, if you have to check anything, for your code you can check it inside the console itself.

Now 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, so. It's pretty easy for you when it comes to running JavaScript code online, now. JavaScript can we'll be back in for our web and mobile applications. So in a nutshell javascript, code can be run inside, of a browser or, in node, browsers, and node provide a runtime, environment. For our JavaScript, code. So. Now that you know where the code runs let's, move on and have a look at the different, benefits, of JavaScript. Now. There has to be a reason, why so, many developers, love working, on javascript. Well, there are several benefits of, using this language such. As it's easy to learn and simple, to implement now, it is a weak type programming, language, unlike, these strong type programming, languages, like Java and C++, which. Have strict, rules for coding, now. It's all about being fast in today's world, and since javascript, is mainly a client-side. Programming language. It is very fast, because any code can run immediately instead. Of having to contact the server and wait for an answer, not. Just that it has rich set of frameworks like, angular Jas, react, Jas, which, are used to build web applications and, perform, different tasks, lastly. It also builds interactive. Websites, now, we all get attracted to beautifully, designed websites. And JavaScript, is the reason behind such, attractive, websites, and applications. Now. Finally, we will have a look at the setting up of the development, environment, or the IDE now, there are different, editors, that you can use for writing your JavaScript, code so. This visual, studio code and then we have sublime, text and then we have atom as well now, these are pretty famous and popular when, it comes to working on any programming, language. But. When it comes to choosing the favorite one I would definitely, opt for visual, studio code so. Today I will be using the visual studio code in order to show you all the examples, and also explain the fundamentals. Of JavaScript. Now. Out of these my favorites, is the visual, studio code it's simple, and easy to run your codes here now. To download Visual Studio code, you just have to type download, Visual Studio code. And just, go to the website koat.com. And. Get your version that is suitable for your system. Now, 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 right away now. In order to become a front-end, developer you. Should also be aware with HTML, codes. So. Here we are going to use our HTML, code as our, host for the JavaScript. Now. First thing first you must get this live server extension. Installed, here before. You try to run your JavaScript, or HTML code. Here. So. All you have to do is just go to the extensions. And then search for live, server. Now, I have already installed this, so you just have to install this before running any of these codes. So. Now that you are ready to learn how to code in JavaScript. Let's. Begin with the fundamentals. Now talking about the fundamentals. The first thing is the variables. In JavaScript. Now, this particular programming, language includes. Variables. Which basically, holds the data value, and it can be changed anytime so. It uses a reserved, keyword var, to, declare a variable now. All your variables, must, have a unique name, so. Now let's get back to a visual studio code so, this is my basic HTML file here so here I have the HTML, head and title, and after.

That I have this script tag as well so, inside my body I have a head tag that says welcome to it Eureka which, means when I go to my website it will. Show me this particular, head tag that is welcome to Eddie Rica, now. It's always a good practice to, keep your script, tag at the end because. 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, a browser may get busy parsing, and executing. That JavaScript, code and it, won't be able to render the content of the page now. Almost always the code that we have in between the script elements, needs to talk to the elements, on this web page for, example if we want to show or hide some, elements, so by adding the code here at the end of the body section, we, will be confident, that all these elements are rendered by the browser. So, here we use a variable, to store data temporarily. In a computer's, memory so, we store our data somewhere and give, that memory location and, name and with, this name we can read the data at the given location in the future, for. Example, think of the boxes, that you use to organize your, stuff you put your stuff in various boxes and put a label on each of them so. That you can find your stuff easily, now, a variable, is basically, like a box so, what we put inside the box is the value that we assign to a variable now. That's the data and the label that we put on the box is the name of our variable, so. Let's see what's the code for declaring. Our variable. Here now. In old days we used to use the Val Q or to declare a variable but. There are certain issues with, that so, now we have started using the left keyword, to declare a variable, so. First we will use the left keyword, here and then. We have to declare a name for our variable, and your. Name should be something that is understandable. Or by looking at the code you can see that what you are trying to write so, here I have a code with the variable, name so, I have given the name as Eddie Rica and then I'll just write console, dot log name. So. Now once I save this code. And finally, we will save this code with the extension, dot J s so, this is our JavaScript, file now, in order to run this in your web browser you need an HTML file, so, now this is where this file will come into existence so.

Here I have added one source, which points, to my JavaScript. File so, here I have just given an extension, as SRC. Equals to index, 1 dot GS, which, basically takes me to my JavaScript. File so. Now when I run this HTML, file, it will take me to the browser and you can see the heading here that is welcome to Ed Eureka, now, how do I get this console, so. You just have to right, click on your website and, go to inspect. And once, this window, has come up you can just go to console, now, inside console, you can see that you have ed Eureka, mentioned, here 1 because we have declared, a variable with. The name ed Eureka. So, our output was console, dot log name. So, as soon as we run this code and go to our console you can see at Eureka now in case I change the name for, example I'm just changing the name to learn, JavaScript. Now. Make sure you give something unique, because you cannot use the, keywords, that are there in JavaScript. As your variable, names or any sort of value so, here I have given the value for my variable as learn, JavaScript. Now, once I just save, this and go. Back to, my browser and once, i refresh this, you can see that it has been changed to learn JavaScript. Now, previously was at Eureka and now you can see that the name has changed to. Learn JavaScript. Because the. Value also has changed, here. So now that you have seen how this variable, Watts here let, me tell you about certain rules, that you need to follow while writing the name of your variable, now. The first rule is that it cannot, be a keyword, that is it cannot be a reserved, keyword in JavaScript. For. Example, let where, these are all reserved, keywords, for JavaScript, so you cannot use them as your variable, name next. Up is you should always have a meaningful, name so you must keep in mind that when, you are giving a name to your variable, it must be meaningful and, understandable. While just, seeing the name itself, also. Your name must not start, with any number. So, how odd would that be to just have a name that begins with a number, like 1 ed Eureka, or 2 ed Eureka, so does not look good that way so, you must not have a variable name that starts with a number next. Up you must keep in mind that there should not be spaces. Or -. When, it comes to the name of your JavaScript, for, example, I have written down JavaScript. Here I can, also just write it like this in order to separate, the two things but there should not be a hyphen or a space in between, the two words so you just have to write it together, also. The names are are definitely. Case sensitive. That. Means if I write learn JavaScript. Like this and then I change it to learn. JavaScript. With, a capital L these, two will be considered, as different, names because. It is case sensitive. So. Now this was all about variables, now let's move on and take a look at constants. Now. By declaring a constant, you basically, assign a meaningful, name to a value so. Once a constant, is declared, it cannot be modified or assigned, any other value. So. Now let's see how we can define a constant, in JavaScript. So for. Example, you want to describe your name in two different parts such as the first name and the last name so, suppose you have let, first, name, is, equals. To Ed Eureka, and then. You have last, name. As. JavaScript. So. Here you would need a semicolon, to separate, the two things and declare. It separately. In such, a manner but, rather than doing this you can just use constants. That makes your work easier so. Now let's see how you can use the constant, in your JavaScript, code so. Now let me just take the variable, name as H so for each we, have a, specific. Value suppose, I am giving the age as 23, now, when I type, console. Dot log, age. And. Then. Let me just save this one again and now. Once I go back to my website and refresh it you can see that it gives me the value 23. So. Here what I am doing is I am declaring a variable but. Also I am giving it a constant, value so, now I cannot, change the value, of my age here, now. Sometimes, we don't want the value for a variable, to change because otherwise it's going to create all kinds of bugs in our application. Now, in those situations. Instead of a variable we, use a constant, so that the value of a variable that as the name implies, can change but. Then the value will remain constant. Now. In the next line I give age is equals, to 21. And then. Now let me save this one and see, what output, do I get when I run this one so.

Let Me just refresh it so you can see that I get an error here because, we have already declared a constant, value for age which is and, again, we are changing the value to 21, so, this will definitely give, you an error that is the uncaught, type error assignment. To constant, variable, so, here your variable, age is a constant, you cannot, assign any other value, to this variable anywhere, so, that it will show you an error so. Basically, we cannot reassign, a constant. So. Once you have used constant. You cannot change the value so, the best practice, is to use where, whenever, you are planning to change the value next so. Now that you know what are variables, and what are constants, you must be wondering, what are the kind of values, that we can assign to these variables. So. Now let's move ahead and have a look at the different data types that you can use so. Now here we have two different types so, first we have the primitive, or the value types and then, we have the reference types, first, we will have a look at the different primitive, types now. The data types are basically, the type of data that can be used and manipulated in a program, so, the different data types include, the numbers, strings, boolean, undefined. And null so. Now talking about these data types let's go back to our code and see what our string literals, what our numbers what our boolean. So. Let's, just type let name. Equals. To Ed Eureka. Then, we have another variable, as age which is equals, to suppose, 23. Now. For checking boolean. That just, give another, variable. As is approved. Is. Equals. To true so. True and. False are the ones that represent, our boolean, values. So. This one is basically our, string, literal, and, this. One is our, number, literal. This. One we are using for, boolean. Next. Up if we just write let. First, name, and, put. A semicolon, it automatically. Gives an undefined. Value to this one but, we can also write. It as first. Name is equals to undefined. So. There's basically no value assigned to this particular variable. Now, the final one is the null value, so. Let me just give it as let date, equals, to null. So. Now let me just save this and then, let me go back to my console, again now, once i refresh it so. Basically I have not given any console, here so there's no output in my console, but then you, can always check, the type of your literals, here so, what I have to do is just type time. Off and, then, if I want to check the type of my, variable. Name so, I can just give name and it, shows me string, so. Here I have my. Name as I do Rica which is a string literal so, this is exactly the value that it is showing me here that is the type of my name is string now. Let's check the type, of age. So. You can see that it shows number. So, my age declares, my number. Literal, here in the, same way when we type type of is approved, pause, I write type of is. Approved. It'll show me boolean, so. You can see that inside the console itself you can find out the types of all of these variables.

Now. If I just want to check the type of my dates I'll just write type of date and it, shows an object. Because. We do not have any value here we have a null value which is also considered, to be an object, in JavaScript. Now, this is exactly where the reference, type comes in so, these were the different primitive, types now, we will have a look at objects. So. Now that you have seen the primitive, types in JavaScript, we will have a look at the reference, types in the reference type category, we have the object array, functions. So, now we will talk about these three different types, so. First let's talk about the object now, object, in JavaScript. And other programming, languages. Is, like, an object, in real, life so, think of a person who has a name age address. And so on so, here I have given, three attributes to my particular. Object, suppose the girl is my object, so I have three different attributes for, this object that is name age and eye color, now, when we are dealing with multiple related, variables, we can put this inside our object, for, example we have two variables name, and age here so what we can do is we can declare it as a property, for, our object, so. We can refer these two as elements, or properties, for our object, this basically, makes the code clear. So now let's see how we can declare an object in JavaScript. So. Let me just declare. My, variable, as girl, and, inside. Girl I'll add properties, for the girls so we have to begin with our curly, braces so. Now inside, the curly braces I will add the properties. Now. The first property was name so. Let me just give the name as, Emily. And then. We have the age as, 23. And then, we also have another, property, as I color. So. It's Brown, now. We separate, these properties. With the help of a comma now. Finally, we close this curly brace along with a semicolon, now. I will just use the console, dot log and. Find. The output for, my object, which is the girl so. Now let me just save, this one and let's. Go, back to the console, and see how it works. Now, inside, this I will add the properties, for my object, which is the goal so here you have to give the name of a first property, and then, use :, and then, I'll just write the name as Emily. And we, separate, the properties, with the help of a comma so, the next property is H, so. I'll write it as 23. And, then. We need to close the curly braces along, with the semicolon now. I'll just type, console. Dot log and. The. Name of my object. That, is good, and close. It with a semicolon so. Here I have declared this variable, or my object, which is the girl and inside, girl I have declared, 13 properties, for, the girl which, is the name and the age now let, me just save this one and go. Back to the console, and see so. You can see that once I run this code I'll get to see the properties, for my object, so, it shows the name that is Emily and H, as 23. Now. Suppose, we want to change the name of this particular object what do we do so, this is exactly where we use the dot notation so. What we will do here is we will just give. The name of our object, which is curl, dot, name suppose, I want to change the name here so, I'll just give the name is equals, to and I'll, give another name here suppose, I'm going to give the name as John, and then. Add the semicolon now. Let me just save this one and see what happens to the output so. Now once we go to the console, you. Can see that the name has been changed to John here now. This is one approach there's, another approach that you can change in order to change the name so what you can do is use the bracket.

Notation Now, what is this bracket, notation so. We can just type girl and use, the square, brackets, so, inside, the square brackets I will give the, name that is for the variable, that I am planning to change so. My name now will be equal, to suppose. I want to give the name as Sam so, I just type Sam and close it with a semicolon and, then, now let me save this one. Now once I go back to my console, and see you can see that the name is changed from, John to Sam again so. These were two different approaches. That is the dot notation and, the bracket, notation through. Which you can also get. Into the property, of your object, and make any particular changes. So, now that you have learned how to declare, an object let's. Move on and see what our arrays and how you can, declare arrays, in JavaScript. Now the JavaScript, array object, is basically, a global object that is used in the construction of, arrays which, are high-level lists. Like objects. So. Now in case you have a list of products, in a shopping, cart or list of colors, or lists of items that are used in order to make a painting, you, will need to declare them with the help of arrays now declaring, them just using variables, would be hectic, because you have to define all of them separately, which. Might be a tedious task when, your list is pretty longer, so, now here comes arrays, to your rescue so let's see how the arrays, work in JavaScript. So, I'm just going to give the name as items. And, inside. This I will declare my array here for, example, I have certain items, inside my list for example I have color then. I have. Paintbrush. And then. I have, a plate. So, suppose these are the items that are present, in my list, so. What I can do is close it with a semicolon and, then now I'll just use, the console, dot log and. I'll. Put items, here now. Let me just save, this and go. Back to the console, and now, once, i refresh this you can see that it gives me the value and also, what are the items in my list so, you can see that I have, added three different, items in my list that is colours paintbrush. And plate so, it gives me the value of the number of items inside. My list and also, what are those different, items. So. Now once I click here you can see that it also gives, me the index, value for each one of these items so. In Eddie the index value always starts, from zero and not from one so, you can see that the index value for color is 0 and then, for paintbrush, it is 1 and then finally for plate we have two so, basically the index value goes from 0 so here we have 0 1 2, which, means that the door length of the array is 3. So. Now if you want to display, any particular. Item you, can just use, this index. Value, so suppose, I want to display, the paintbrush, so, what I can do is use this square bracket if the value as 1 because.

The Index is 0 1 2 so the index value for paintbrush, is 1 so, let me just save this one and now. Let's go back to the console, so you can see that the output it gives me it's just paintbrush. Because, I have just given the console.log. Item, value as 1 that, means I only want to see the value that is there in the place of one that, as the index value should be 1 not. Just that you can also add something, else in your list with the help of the index, value for. Example I can just give the name and, specify, the index, value where I want to add something, suppose. I want to add another item so, the index value will, now be 3 because. I want to add it at the end of my list so I've just given, the value, as 3 and. Suppose. I just want, to add sprays. So. I'll just type sprays. Semicolon. And then I'll, just save this code, so, I'll add the item, sprays, here, now, let me just change this so. That it shows me the value of all the items and, let. Me save this one now, once I go back to my console, and reload, this now you can see that the value of the items have changed from 3 to 4 and also. Another, item has been added to my list and also, you can see the index value so sprays come at the index value 3, that's exactly, what I have added and that is exactly where the value has been added, to now. Here you don't need to have a similar type of data, that, is if I want any number. To be added here suppose, I just want to add 100. So. I can just add this, number, here and then, save the code, so. You can see that in the output it will give the value as, color. Paintbrush, plate and hundreds so it need not be a similar, data type you, can add different, data, types and also put it in the array itself, now. If I go back to my console, and just, type, type. Off the name, of my list that as I have given it as items, you, can see that it shows object. So, you can see that array is basically a type of object. We. Can also use the dot notation here, and find out various properties, so you can see that you already have, two shrimp properties, that you can find out so, let's just find out the length of my list so we can just type length and, let. Me just save this one now, once we go back and refresh. This you can see that it gives me the length as 4 so, basically, with the help of dot notation you, can also find, out the values or different properties, for, your array. Now, this was all about a risk so we have seen what our objects. And water arrays now it's time to move on and have a look at functions. In JavaScript, so. Functions, in JavaScript, are divided, into two different types first, we have the predefined, functions, and then, we have certain user-defined. Functions, so. Basically a function, is a sub program, designed, to perform a particular task, now. Functions, are executed. When they are called and values. Can be passed into functions, and used within them so, now let's see how we can declare a function in JavaScript so, here I'll use the keyword, as function, for declaring, any sort of function, or the name that I am going to provide to my function so now let's see how we can declare a function so, I just want to view welcome to a director so what I do is take the function, keyword and suppose. Let me just type view, and. Inside. This I'll have to add the curly braces inside, which I will have my console. Dot log. So. I want to print. Welcome. To Ed Eureka. So, now once I chose this now, after the curly braces we have to call the function now so my function name is view, so, what I'll do is just, call my function, here and now. Let me just save this one. So. Now once I go to my console, and then I run this code you can see that it shows me welcome, to ed Eureka so, what actually happened. Is I have used a function view, and I, have inserted, whatever, I want to display and after. That I have called my function here so what happens, is so, inside, console.log. Whatever, I have written is, displayed. In my output, with the help of this particular function that has been called sure now. We can also add a parameter, so let me just add a parameter inside. My function so suppose, I've added a parameter, as name, and, here. I'll concatenate that, particular.

Parameter, So let me just type name, here and then. Inside my function, I will be typing, whatever parameter. I'm going to pass through it so, inside my function I'll just write learn, JavaScript. So. Here I'm just passing, a parameter inside. My function so here I'm giving the name as loan JavaScript. So, let me just save this one and go back to the console, so. Once we run the code you can see that it shows welcome, to a Dirac I'll learn JavaScript. So the value has been concatenated. Here so you can see that there's a missing space here because, in my code I haven't, added the space so in order to add a space so, you just have to leave it blank and then add it again and now, once I save this code and go, back to my console, and run it again now you can see that there's a space after at Eureka because here I have, added a space and then concatenated. The name. So, now let's check for the value square. So, now let's see how the function, works in, JavaScript so here we have taken the keyword, as function. And we, have given a name to our function suppose I want to find the square of a number so I have taken the function, name as square, so, now inside the square I have given the parameter, as number, and then, you have to open the curly braces inside. Which and return the value that I want, as my output so, here I want the square of the number so. I've given the return value as number, into number, which will give me the square now, you have to close the curly braces next, up you will define the number now so here suppose I want to find this square for number two so I have defined a number here as net number equals, to square of two so I want to find out this square of the number two and then, finally, console, dot log number. Now, once we go to our console, you can see that it has given me the output as four because. The square of two is four and I have asked, for the square of the number two so, this is what the output is, so. Now that you know how functions, work in JavaScript. Let's move on and have a look at some conditional. Statements, in JavaScript. Now. What are conditional, statements, when we use the word as if else, or, we put certain conditions. That is when the conditional, statement comes in JavaScript, so let's see how that works. So, first let's have a look at the if statement. So. Suppose I am declaring a variable here. As number. So, let number equals, two let it be an undefined, array here next up I will define the array or I will provide a set of numbers inside. This particular array. So. Let me just define this, and provide certain, value, so, let my array, be one four, one, two. Five, two. So. These are the set of values that I have provided inside my variable. Next. Up here I will be using the if conditional. Statement, so, now inside, if we are basically, supposed to provide any particular, condition, so I have to find a candy here suppose, I want to check if the, number in, position. Zero is equal. To the, number, in, position. Two so. This is the condition, that I have provided here, so now after the condition, I will just try to get the output so. I'll just give console, dot log so.

Let Me just say the, answer. Would be yes. So in case the condition, is satisfied it, will give me an output as yes, so. Now let me just close this with a semicolon, so. Now this is where and how we are using our if conditional. Statement, so inside if we have just provided a condition. For our variable, that we are using so, our condition is that to, check whether the number in the position, 0 is equal. To the number in position, 2 and in, array as you remember, the index always, starts from 0 so we see that this is 0 1 2 so you can see that the number is in position 0 and, 2 are same so, basically the output should be yes so now let me just save this one and go, back to our console, and see what it shows so, I get the output as yes, because the condition, has been satisfied, here my if condition, is satisfied, and that is exactly where I've got the output as so. Now let's see what is the if-else, condition. So it is pretty similar to the if condition, so, it's pretty similar to the if condition, just that there's one more condition that gets added here now, in this case if both the numbers were not equal, what, we would have got suppose. Let me just change this value to 3 and now, let me save and see, what my output, is so. You can see that we do not have any output because I haven't given any value, for, the next condition that is what if these two numbers are not equal, so now this is where the else condition comes, in so I'll show you how you can add the else condition so. You just have to write else and then, I will give another output here, so I will just type console, dot log and. Then. Let it be known so. When the condition, is not satisfied it. Comes out from this loop and goes inside the else condition. Where if the condition, is not satisfied it. Will give me the output as No so now let me just save this and go back to the console, and see now, you can see that the output is shown as no because. Here the condition, is not satisfied so. It has come out of this particular condition and now, it's checking the next condition so. Here if this, condition, is not satisfied the. Output, would be no so. You can use this if else condition a number of times and you can provide different conditions. And also provide different, outputs, for different conditions that you are going to imply, here so. Now let's move on and have a look at loops, so. In JavaScript we, have the for loop the while loop and the do-while loop, so. First let's see how the while loop works so. For that first I have to declare, a variable suppose, I am taking I equals, to 0 I have, to initialize, the value, of I and then, give a condition, so here I'll use the loop so, I will take while and give the condition as while I is less, than 5, that, is the value of I is less than 5, and then. I'll give the output here so it will be console, dot log. Number. Is. Now. I'll concatenate, the, value of I here. And then. Finally, it's I plus plus so. Now what happens, here exactly, is so, I have initialized. The value, of I as 0 and then, I have given, a loop which says that while I less, than 5, we, will be printing the number, that this number is and the particular, number and I, plus plus that as the value will be incremented after.

Each Loop, so, what happens, here is the loop will start from 0 and it. Will go on till 4 so 0 1 2 3 4 as soon as the value of I reaches, 5, it will come out of this particular loop, and the, output will be only from 0 to 4, Vickers, so now in order to check the while condition. First I will initialize, the value, of I so, let me just take the initial, value of I as 0 and then, here I'll use my loop so suppose, I am giving a condition, here that as I is less, than 5 and for. The value of I less than 5 I will give an output which. Will be console. Dot log. Number. Is and. Then, I will concatenate the, value of I here and then. Finally increment. The value of I here so. Now what exactly happens. Here is that so, first I have initialized. The value of I to be 0 and then, I have considered, a condition that is I must be less than 5 so, I had to put it inside a loop so I have taken the while loop here so, what we consider is wildly, I value, is less than 5 our output, will be number, is and it will take the particular number so, it will count from the number 0 and go on till 4 now, as soon as the number reaches, 5 it will come out of this particular loop, the, I plus plus is for the increment, that is from 0 to 4 and as. Soon as it reaches, 5 it will come out of this particular loop, and then only the, number 0 to 4 will be visible in our output, so. Now let me here save this and see what happens. So let's go back to the console, so now you can see that the number is printed at 0 1 2 3 4 so, as soon as the number reached 5 it has come out of this particular loop, so, exactly, how the while loop works, now. In a similar manner you can also use, the for or the do-while, in, order, to insert loops in your JavaScript. Code so. In do-while what happens is first you, make the tasks happen, that is you use the do keyword and put your output, or whatever value, you want and then later, on you put the condition, so the condition, is checked later. Whereas in while first you check the condition, and based on that you provide the output, okay. So this was about the while. Loop in JavaScript. Now let's move ahead and see that how does the do-while, loop works in JavaScript and also. How the do-while, is different, from the while loop so, in case of do-while, loop what happens, is the condition, comes a little later so, first we declare the variable, and here, we take our do loop and inside, the curly braces we, give our output, so, we have our output as number, is and we concatenate the, value of I and then we increment it, as I plus plus now. Once. We are out of this loop here we will be adding our while loop so here, we will be giving our condition, so, suppose I am giving the condition, as I less than 6, so, what happens is now it will take the values till 5 only, and what, happens, here is it will keep printing, the value, and come out of the loop and check for the value, or the condition, that I have provided inside, the while loop so. Now let me just save, this one and go. Back to my console, and refresh. This and see so, here you can see that it's printing, the value from 0 to 5, so previously, we had given the condition, as I should be less than 5 so, it printed, till the value 4 now, in a my dua loop, i have checked till i've al u less than 6 so. Here it has printed, the value from 0 to 5 and as. Soon as the value, is more than 5 or the value goes to 6 it comes out of the loop. So, now let's move, on to the for loop and see how the for loop works, so, I'll using for loop you don't have to initialize, the value, here so, here we will begin with our for, loop and inside the for loop there are three sections and the first section you initialize, the value for I so. Here we are giving I equals, to 0 and then. The next section is the condition. For the I value, so here I am giving the condition, as I value should be less than 7 and finally. We will give the increment, or decrement, value so I am giving I plus plus here and finally. We give our output that is console, dot log number. Is and we concatenate the, value of I here, now. Instead of declaring, your variable, here you can do one more thing so, what you can do is inside your for loop itself, you, can just type let and then initialize. The value in this manner as well so, now let me just save, this one and now. Let's go back to our console, and see what is the output so, you can see that I have given my condition that I value, should be less than 7 so, what it prints here is the value from number 0 to number, 6, so. You can see that using the for loop is pretty easier, compared, to the other loops you do not have much, - audio you do not have too many sections, to be divided, in this you, just have to use the for loop inside.

Which You can initialize. The value of your variable, and also, provide the condition, and then give the increment, or decrement, value, altogether, and finally. You just have, to add the output, that is whatever you want to print so. This was all about for, loop and with this we come to the end of loops so, we have learnt about the while loop do-while. Loop and the for loop and how these 3 loops work in JavaScript. And how easily you can define any variable. And insert, it into the loops so. For any sort of condition, rather than writing the same thing twice or thrice or number of times what, you can do is you can just put them inside these loops and let it just take place all at once. Now the final thing that we can discuss, in JavaScript. Is the switch statement, so. What is this switch statement so, if you have a number of cases that you are supposed, to check inside, any particular, program, so, you can use the switch statement so, what happens is inside, your switch statement, you can add various, cases and then. Go for the value, that you want to execute so. Let's see how these switch statement, works in JavaScript. So. For example, let me just take a variable as let, game, equal, to let, me just take any particular game. Such as cricket, its World Cup season anyway, so. Let's take the value of my game as cricket. Now. You just have to use the switch statement inside, which, I will just declare my variable. Game so. First we take the switch condition, inside which I'll take the variable as game and inside, the curly braces I will have my first case so. My first case I am adding, the game as football, so, whenever the game football appears, I will just give the output as console, dot log. I don't. Want. To watch, football. Now. This is our output and then we give the break statement, so that we can switch into our next case, so. Now if we consider another, case and suppose, here we have, hockey.

And Then. We will give another output for, hockey, that is console, dot log and. Then. We put console dot log as, I. Don't. Play. Hockey. And then, break the statement, again now. The next, case would, be cricket so suppose, I have cricket. Here so. I will just give, the output here, as console, dot log. I, love. Cricket. Now, in case I hadn't initialized any particular, game here so we always near default, value when it comes to switch. Statement. So, here what we do is we take another default. Value, and for. Our default, value, we give another console. Dot log so. We just give match. Not, found. So, this is how we write a switch statement, in JavaScript. Now let me just save this one and go. Back to my console, and refresh, this. Okay. So there's some error let's see, so. Yeah we just had to put colons instead, of semicolons, now let me just save, this one and now. Let's go back to our console, and see so. You can see that the output is I love cricket because, here I have already initialized, the. Game to be cricket so what I want to see is whenever the switch, statement comes, in an insight switch we have various. Cases it will only take the output, where I have the value, for game as cricket, now. In case I change this value, to, football. And now. Let me just save this one. Now, let's go back to our console, and refresh, it and see and it, says, I don't want, to watch football be. Kissed for my football, case. I have given the output as I don't want to watch football so, this is exactly what is getting printed, or this is what we get as the output now. Let me see let me just give, foosball, and we. Do not have foosball in any of these cases so it should go to the default value, but, let's see what is the output here so let me just save this one now and go, back to the console and refresh, it yes, so exactly the we get the output as match, not found because it, goes to the default, value, so in case any of these are not found or matched with the initialized. Value, it provides, us with the default, value, here so. This was all about the switch statement in JavaScript. Now with this you know a lot more about deed loops and switch statement. And before. That you have also learnt about all the fundamentals. Such as the, object, arrays. Strings and how you can, take these syntax, and include. Everything, inside your JavaScript. Code and also, how you can get it inside your console, and see, what is the output with the help of your HTML file, as well so, now with all of these you have learnt, about the variables, objects, functions, arrays, loops. And conditional. Statements in, JavaScript. Now, this will help you create your own website. Now you can beautifully, design, your website with the help of JavaScript. And also by playing around with these fundamentals. Of JavaScript. So. This was all about today's, session and I hope this video will help you learn the basics, and the fundamentals of. JavaScript. And also. It will give you a boost to get started, with your JavaScript, code and also create, your own webpages, so stay. Tuned for more such videos and, you can always go, back and check out a playlist if you want to learn more about JavaScript. Also. Don't forget to share your opinion, in the comment section below till, then thank you and happy, learning I hope. You have enjoyed listening to this video please, be kind enough to like it and you, can comment any of your doubts and queries and we, will reply them at the earliest do, look out for more videos in our playlist and subscribe. To any Rekha channel, to learn more happy. Learning.

2019-06-24 06:04

Show Video


Got a question on the topic? Please share it in the comment section below and our experts will answer it for you. For Full Stack Training curriculum, click here: http://bit.ly/2AUZv2y

Good explanation.

Explained very well !! Requesting lot more basic consepts And examples Thank you.

I was just looking for a video like this, and then it appeared in my Subscriptions! Thanks very much :D


You are most welcome Mahendra. Don't forget to subscribe our channel.

Thanks for the appreciation Ross.

@edureka, thanks for contribution. Can you drop a full course on Ionic framework

i love it

Thank you edureka :)

Other news