Web Development 101: Javascript For Modern Web Developer | Somenath Sen | Skillshare

Web Development 101: Javascript For Modern Web Developer

Somenath Sen, SkillShare Instructor Teaching 100+ Classes

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
34 Lessons (2h 55m)
    • 1. Introduction

      2:01
    • 2. What is Javascript?

      1:58
    • 3. Setup Our Tools & Environment

      8:29
    • 4. Javascript Comments

      3:44
    • 5. Javascript Statements

      4:01
    • 6. Javascript Placements

      4:12
    • 7. First Javascript Program "Hello World"

      5:25
    • 8. Introduction To Javascript Variables

      5:57
    • 9. Variables DataType 1 : Numbers

      2:52
    • 10. Variables DataType 2 : Strings

      4:23
    • 11. Variables DataType 3 : Boolean

      2:01
    • 12. Introduction To Javascript Fuctions

      4:23
    • 13. Javascript Fuctions In Action

      3:21
    • 14. Gobal and Local Variables

      5:27
    • 15. Javascript Return Statement

      4:01
    • 16. Javascript Operators

      5:35
    • 17. Javascript Assignment Operators

      3:59
    • 18. If Else Statements

      7:50
    • 19. Javascript Switch

      11:11
    • 20. Javascripts Loops : For Loop

      7:23
    • 21. Javascripts Loops : While Loop

      4:52
    • 22. Javascript Loops : Do While Loop

      6:35
    • 23. Javascript Arrays

      7:30
    • 24. Associative Arrays

      6:34
    • 25. Introduction To Javascript Event Handlers

      6:28
    • 26. onMouseOver Event Handlers

      6:08
    • 27. onMouseOut Event Handlers

      4:21
    • 28. onLoad Event Handlers

      4:40
    • 29. onUnload Event Handlers

      5:52
    • 30. Javascript "Join" Method

      5:35
    • 31. Javascript "Pop" Method

      6:06
    • 32. Javascript "Reverse" Method

      3:57
    • 33. Javascript "Push" Method

      4:20
    • 34. Javascript "Short" Method

      3:45

About This Class

53fcc311

JavaScript is a programming language that used to make web pages interactive. It runs on your visitor's computer and doesn't require constant downloads from your website. It is lightweight and most commonly used as a part of web pages, whose implementations allow client-side script to interact with the user and make dynamic webpages. JavaScript was first known as LiveScript, but Netscape changed its name to JavaScript, possibly because of the excitement being generated by Java.

JavaScript will help you to add behavior and interactivity to your pages. We'll begin with the basics: the core of JavaScript language and syntax, how to write it, where to put it, what tools you can use and how to used it. We'll then start to go step by step through the different things you do with JavaScript. We'll work with forms, work with events, Fuctions, variables, Arrays, Loops, and much more to get understand how to used javascripts to create intereactive web pages. also this course will cover some basic HTML5 training before to start with javascript. so if you don't have any knowlage about html5 knowlage but still want to learn javascript this course is for you.

And along the way, javascript is the letest trend and big companies are searching for the good developers in recent years. So whether you're brand-new to JavaScript or perhaps you've been working with it on and off for years, brush up your knowledge or learn something new with javascripts advance course.

Recommended class before take this class: 

1. Introduction To HTML5 Web Development Class &

2. HTML5 Advanced Programing For Modern Web Developers Class

What are the requirements to take this class?

  • Internet Connection
  • Passionate About Learning New Things
  • A Text Editor [Free Resource Include]

What you'll get from this course?

  • Over 34 lectures and 3 hours of High qulity traning!
  • Learn What is Javascript
  • Learn Javascript statements
  • Learn javascript placements
  • Learn Javascript variables
  • Learn Gobal and local variables
  • Learn Javascript Fuctions
  • Learn Javascript Return Statement
  • Learn Javascript Operators
  • Learn Javascript If else statements
  • Learn Javascripts Switch
  • Learn Javascripts Loops
  • Learn Javascripts Arrays
  • Learn Javascripts Advance Event Handlers
  • Learn javascripts Advance Array Methods

Who can take this class?

  • Web Designers
  • Web Developers
  • Designing Students
  • Programmer
  • Computer Science Students
  • Anyone Who Want To Learn Javascript and coding

Transcripts

1. Introduction: JavaScript ease and interrupted programming language, and it's developed by Nate Scrap. It is somewhat similar to Microsoft. Visual Basics Fall on IBM Race In general, script language are more faster and easier to call him than the more structure and compile language. Such a C and C plus plus script language are generally taken longer to crosses. Then I compile language, but very you school for shorter program. Hi, this is so not saying and welcome to JavaScript. Advance scores. JavaScript will help you to add Viv Year and interactivity to your webpages will begin with the basics. The core off JavaScript, language and syntax. How to write it. Where to put it, what tools you can use and how to use it will then start, go step by step. True, the different things that you do with JavaScript, who will work with forms, work with even function variables and A's looks and much, much more to get understand how to use JavaScript toe. Create interactive Web pages. Also, this course will cover some basic estimate. Five. Training before to start with JavaScript. So if you don't have any knowledge about estimate five, but still want to learn javascript this course is for you. And along the way. JavaScript is the latest rain on. Big companies are searching for good developer in recent years. So whatever your brand new JavaScript or you have been walking with it on and off for years , brush up your knowledge or love something new in jail, a script advance course. 2. What is Javascript?: all right into this video, we will learn What is Joe Waas Gripped? JavaScript is a programming language that used to make weapons interactive. It's run on your visitor computer and does not require constant download from your website . It is lightweight and most commonly used as a part off with pages who's implemented in allow clients that script to interact with the user on dmat dynamic webpages. JavaScript was first known as Life Script, but Netscape change its name to JavaScript, possibly because off the excitement being generated by Java now you guys asks me, Are JavaScript and Java are the same thing? The answer is no. They're not Onley their name a similar job wise, developed by Sun Microsystems, and it is a powerful and much more complex programming language in the same category as like C and C plus plus. But JavaScript was created by Virdon. Each at Netscape and Double script is a scripting language, and it's the lightweight programming language that is interrupted by the browser engine. When the whip it is loaded. Almost all missile brother like Internet explorer chrome Firefox, the 40 have javascript in it. In the one next videos, we'll explore JavaScript in more details on learn. It's in text and semi metrics in step by step 3. Setup Our Tools & Environment: before they started cording our estimate pages. We need some tools for doing, including First, we need a whip closer. If you are using Windows, then Internet Explorer will already install in your windows because Internet Explorer is the article frozen. But if you are using Mac Safari already installing your Mac, because so far he is a default browser in Mac. But in this course I recommended Google Crume because Google Chrome is pretty much lightweight fast on DSA Cure. But if you are familiar with Mozilla Firefox, you can download Mozilla Firefox as well. Firefox is also a damn good browser to start downloading Google Chrome Goto www dot google dot com On in the search box, type Google Big and click on the very first result. The Web address is www dot google dot com. Slask Room Now in the West Side, click on download in download page. You see a download Chrome Britain. Click on that button, click on Accept and Install Google com set up will downloading and after it download complete double click on it to install it. I'm skipping the step because I'm already installing Google Common using it, but believe me, it is very simple. Process to install Google Come in your mission. Just double click on the set of file on, Follow the instruction After downloading and install our brother. We also need a coordinator to read our core goto Not bad hyphen plus hyphen plus dot org. Or go to Google and I North Bad Plus Plus and click on the first result on the search in the note plus last was with Syed. First, let's check the North Plus Plus plus features. Click on the Features Link Over here. The very first creature is thin, just highlighting which is very important, not part plus plus. Also have features in user defined syntax. Ally Teen You I. Although competition what competition, function, competition and function Perimeters Hills Mighty documents. You can view multiple documents in not trust restless interface. Although there is option mighty view, you can view asthma's document as you can in no plus plus players. Also, you can ju mean and doom out your court. Multiple language support no matter what country, what religion you are, you can use note plus plus plus in your language. Also, you can record your macro and playback on also no prospects plus is lightweight and, of course, is 100% free and open source. So now click on the download button over here. In the download page, click on the very first link No plus plus plus in stroller. Download an installer in your machine. I'm just cancel it because I'm already download and install not for specialist, so I'm just keeping the step. But when you don't know, note plus plus plus installer does double click on it toe open the installer and follow the instruction to install new trustbusters in your machine. The second coordinator that I recommended is sub line text. Sublime text is pretty much good coordinator on support almost every type of programming language, but the blame takes is not free. You can download Sibling takes trial version by Click on this download for Windows Button over here, give you free 30 day stand. You can try it, and if you think supplying core editor is good for you, you can buy it as well. To buy sibling test, click on the piling on the top Sibling text cost $70 our license. You can buy multiple license as well by click on these the licenses for business. Burton, over here, choose your continuity. How many of license you want to buy? Here? You can get a discount for a Blunk purchase he fuel purchased 10 plus license. You can get $60 for license. You can buy 25 plus lessons. Then you can get. Then you get $55 per license. And if you buy 50 plus license, then you can get $50 for license. After explore your help. Your you can buy these if you want. The next quarterly dirt that I recommended is Komodo. Eric Humanoid is also a free and open source coordinator for Web developer, which also support of almost any type of programming language. You can click on this download button to download commemorated. You can download commander it and use it for free because it is open source and 100% 3 but co moderated. Also have upgraded version, which called Comodo i D. You can compare tomorrow idiot and comodo idee features over here as you can see Comotto idee or for more features than comodo ready. If you want to buy Comotto, I d click on the by and of great burden over here on in this page, you can see three type of licence for Comodo I d. Foster on his Commodore I. D. Personal, which costs $99 for license. Then the 2nd 1 is most popular and which called comodo I D. Which cost to $95 per license, which is pretty much costly on 31 is common Weide Core Team, which is $1615 far five. License, which is pretty much costly also. So if you want to buy Comotto, i d. Just to your license type and buy it. But I recommended Void the free one, which is Camano Idiot downloaded on. Use it. We know comfortable with it, then upgrade to Comodo i d version. The next quarter leader that I recommended is bracket goto brackets dot ru. So let's talk about bracket Bracket is another open source text editor on which is lovin bracket, is it understand? With design, as it say here, a modern open source text editor that understand what design What does that mean? That means you can open appears defile in bracket directly on bracket will generated sees this core for every layer in that year's different, which is pretty damn cool on. I love that feature. By downloading the bracket, click on this big download bracket button and don't know the bracket in your computer bracket. Also support Fiercest three processor Saxon List, which is a pretty damn cool creatures as well. All good support, Life preview and in Line a Leader, which is also good creatures. So if you're comfortable with bracket, you can download it and install it in your mission and use it. 4. Javascript Comments: All right, So in this video, we're gonna learn how to write Java script comment. So first of all, I'm gonna go to my project folder Angop it is in next pile on Festered right after it. Andi would have to do is rename this index file toe in next hyphen Common's on right click on this index hyphen, Common start dates, table file and open it in. No pad plus plus, Andi, what I have to do is most of all, I'm just removed these document that right on in hair, we just type our comment. So, first of all, on Minister, you how to write a single line comments. Then I will show you how to write the multi line comments in Jalisco. So let's try me single and common. So if you need to write a single and comment, you need sh less on DSA less That's it. Unit doubles less. Then you need to write your comment. Let's say this a is each of us ripped government then said the file on Goto over product polar, and they will look on this filed open this up in the browser. Let's see how it looked like as you can see here as we expected. We see nothing here because this is the comment and brother will ignore those line because they can find this is the comment. So let's say now you have tow a multimillion. Common. So how you have to do that? Most of all I just given Ender on Go on next line. And if you die if something here, as you can see her, this takes are not green. That means the stakes are not the comment. So let's say we have some couple of lines here on. We need this couple of lines indoor JavaScript comments. So what have to do is we just type slash s. Then we just type star on when we have to end our comment so in gets this line. So what I have to do is hair. We just start with this process from backward, like first we need star. Then we need Slesin Now, As you can see here, these five lines are now in the comments. So if you want to write a multilane comment first you need to open its less than you need toe type star. Then you have to write your comments how maney line you want on, then whenever your line will end, whenever your comment will and you just write star again. Then he was less the end of the comment. So in this way, you can type comments in job asleep. Either it will a single and comment, or it will a multi line comments. 5. Javascript Statements: Now we know how to write JavaScript comments on in this video we will learn what is jealous . Keep statements. So what I have to do is and just go to my project. Polar on copy. And best this in next file. Hair on rename this three next hyphen statements not external. Andi ratted on this pile on. Open it in. No bad plus plus. And first of all, I'm just removed these JavaScript comments there. Onda, we have some nice and clean space to write our statement. So what is the ah, skip statement? Actually, statement is very, very important in any programming language. So first of all, is a stipe here a simple document dot right program and give us the mink alone after this document, Right? Andi, when will give us Let me go alone after these documents, right. That means there's just a program Are ending hair on this call a statement. Let's just go to our project. Cooler and I will be on this file and open this up in the browser and has even see here. We have a line here. This called. This is a statement on the computer program are in here just because we add a systemic alone after this document, right? Function on if we want to add another takes or another. Lange's copy this document dot right program and pasted. Right? Afraid Andi just changed these textile this a statement to and saved a pile on goto our browser and difference the pitch. Now we have shooting. This is statement who lives a straight another thing. And so now it local nice and pretty. So let's just go to our brother and refers the pitch now, as you can see here we have the two lines here. This is statement. Then we have on this a statement to So what? This two lines Taleb Rosa the first line. Tell the brother print this text in the browser, Then bring this take in the browser. So when you write any juggle, stripped, cooled or any javascript function on end with a semi colon, the program will in there and that mark as a statement. So, in hair, we have who statement? 1st 1 is still a brother. Print this Tex on 2nd 1 is still a browser. After the stakes, bring this decks on, then exit the program. So this how the statement will work in any computer programming language as well as the javascript 6. Javascript Placements: All right, so in this video, we're gonna be learn JavaScript placement. So, first of all, I'm gonna go to my project for Lor Onda Copy disc Weil and listed right up to it. I really in this to in next. Hyphen policeman dot Islam on Redlich on this file on open it in note pad plus plus and what I have to do. We just removed one document. Not right from here. Andi, change this document dot Right, Tex, do something like, place me anywhere or something as you like, then super file on Goto our project Fuller on doubling on this quiet. Open this up in the browser to let's see how it looked like. And as we expected, it just brings out this sticks in the browser. Now, let's just see if I could the script ag into our body is this Give us the same result or not. So what after we just cut the script from hair and festered in the body and saved a while and good over browser on reload the page. Now, as you can see it give us the same output. It just bring the text. But look at this estimate file. The script AG is not into the head. It is into the body, but still. Now it give us the same output in the brother so you can write your script, act into the head or into the border. But keep it in your mind. When you write the script, I get your body. Please be careful in this. Don't write script AG after the opening body deg on, then light your let's say something like heading our paragraph or anything after this cryptic Yes, Puccio script AG light After the closing body Tech. Keep it in your mind. It is very, very important. Always write scrip tag right before your ending body attack. Either. It will give you some errors on when you read in the script and into the head. That is no problem where you can write it. There's writing after the title, and it will give us the same effect. And when you add external JavaScript, file into your esteem. Ill page like this one is goto the cooler and open this head hyper link have in javascript arrestable piling door. Not bad on as we're going to see here when you link I external JavaScript quietly into arrest email file. Just keep it in your mind. Always put it into your head, not quoted into her body, either. It will not work perfectly on when you retain the internal JavaScript quietly using script AC. You can Linton into your body, or you can retain your head. But keep it in your mind when you add the script and into your body, always and always written before the ending body tag and when you retain the scripting into your head, just retain after the title tag. 7. First Javascript Program "Hello World": All right, So in this video, we're gonna be learned how to create your first javascript program, which is Hello, Ward. So, first of all, I'm gonna go to my project. Fuller on open this index dot aced email file in tow. My note. Fat plus plus on in this industry or a steaming pile after this title tag, I'm gonna just give some ancient on in hair. I just open my scripted as I mentioned before, Script AG is used to write internal JavaScript fine in a steamer. So we are using script here script. Then we need to add another attribute here called Night. Let me tell you why we need a type attribute here. This type attribute will tell the browser more clearly that this is ah javascript. If you are using newer version off browser, then you don't need this type tech. But if you are using the older version of browser, then this type tech will help your Lord on. Render your javascript court without any fear or in your browser. So for respect is, use this type attribute in your script tag. So this this type type equals do noble condition on into the condition. This this type picks slips, then JavaScript then closed the suit drag on and also the closing bag for this cryptic on into the script AG, you can write your troubles group so into the script act. I'm just open document dot right and then open our noble condition and into the condition. Does this type no would. So why do we need to write the document dot right function? Because document dot right is the in village of a script function toe print anything in the browser. So if you need to print anything in the browser, you want to write document dot riot, then open and close the bracket to this round bracket. He will open your double condition and into the condition he will write Hello world and we need another thing, which is a semicolon after this document dot right function and good and said the while on Goto, our reject fuller and double click on this file. Open this up in the browser to let's see how it looked like on now. As you can see, here is our hello world. Okay, let's just do one thing. Just deal. It is heading and paragraphs from the 40. We'll do our takes the leader and remove this heading and paragraphs from the 40 because we don't need this in hair and save the file and goto our browser again and refresh the page. Now, as you can see here, we just left with the hello wall, which we are just written in the script AG using document out right function so document dot right are printing this hello wall takes into our Broza. If you want to tide anything in this document not right, it will directly print in your browser. So let's try one more checks. Here is this type Thisted is my quest Gemma script who were Onda said the while goto our browser on because the pitch now, as you can see here, the document dot right function will bring this sticks, which is? This is my first javascript program into the browser. So you can type anything in this document, daughter I function and it will just bring those sticks indoor Broza 8. Introduction To Javascript Variables: All right, so in this video, we're gonna be learn JavaScript really evil, which is very, very important part in JavaScript as well as any programming language. So don't skip this video, guys, because this is very, very important part. So as like the other programming language, JavaScript also has very well. Very well. I like the container. Which whole data for you on you can use those data by targeting the really will name into your program does the pretty simple concept. Let's say you want to use a data in thousands of lines, of course. And on the next day, you want to change those deter to something is so you just want to change those data onto those thousands of lines up court. What? When you come to variable, you can hold those data into a variable and use those variable name into those thousands of line. So when the next day is coming on, you just want to change the data. Just change the data into your very a bill on those thousands of line who hold those data using that very real will update automatically. That's the power off variable. So let's just type ajumma skipped Grievous before one type of JavaScript variable. Let's just go to our project. Fuller on copy this file and pasted right after it and renamed this school in next hyphen. Really? This on, right? Click on this while and open it in no back plus plus. No. Remove this document. That right here because we don't need these document daughter right here. So what have to do is just great. Our was variable. So in the javascript, if you need to create a variable, you need to type V A r. We are refer to video. If you like. Veer, the browser will automatically identify. This is a javascript irritable all it. So now we have to name our variable exploit. Is it anything as everyone but keep it in your mind? Every double skip very will start with a letter and, uh, underscore. But a javascript Reville will not start with the special letters or the percentage sign or the dollars and or anything like that, or the numbers or anything like that. Double scoop variable. Always we start with a NASCAR or with the simple later. So in this case, we just type X. So it is our very well. Now we just give us face and then give equal sign. And now we have to put our deter. Let's say 59 59 is our data on the eggs. Very well are holding this data Now we have a cynical A semi colon is closed. This statement, as I mentioned before statement in JavaScript are always closed by your cynical on. So we just close this statement on in the next nine. We just started document dot Right Andi, into this document. Not right. We don't need any the world condition here because we don't need toe print. Any text in document dot Right? We just need to print are really well, so we just type are really evil name directly into this document. That right conscience. So let's just type X and that's it. Save the file on goto our product cooler and double click on this. Quiet. Open this up in the browser to let's see how it looked like. Now, as you can see her, it just cleaned out our data push. He's into our eggs. Variable. So this is the power off the table. If I go to my text editor and change this data here. Let's it I just 60 and save the file on. Nothing to change in this document dot Right, because this already hold our very will. We just think that data into our valuable and good over brother and because the page and now the numbers are 60. So this is the power off variable. You can create a variable and old data into it, and you can use those Greeleyville name into thousands of problems of line on when you need to change the data, just change it into your variable on it will abyss those thousands of pounds of line off court without touching anything in line off course. So this is the power of able, and in this way you can create very reels in JavaScript. 9. Variables DataType 1 : Numbers: in our previous video will and vote is Joe scared variable and how to use it in our Javascript. And now in this video, gonna Midland Javascript. Very well did it. Right. There are three type of data types in javascript. Grievers one is number Sligon. Morning. String on hard one is bullion. So in this video, we're gonna learn the numbers jittery. So let's go to our project. Fuller on. Create a walkable core before the steam in a document. Just copy and pasted over here and change the name toe in next hyphen. Very real hyphen data. This is the date a date on, then Hype in number on rhetoric on this file and open it in the note pad. Plus plus in our previous really will see javascript credible will bring the number without any issue. So we're going to see here. The number is 60. You can change it to whatever you want. Make it will 1000. And then said the file goto our project cooler and I will get on this wild. Open this up in the browser on now. You can see here. Will chosen is friend out in our Broza. So now you already know JavaScript variable will putting the number. So let's see. Is yours good variable pouring the decimal number or not? So let's just create a decimal number here. Let's just give a point aan den by whatever number we want. Andi, save the file. Goto, our browser on drift is a pitch. Now, As you can see here, JavaScript is also freeing the additional number. Whatever the civil number, it waas JavaScript will print it directly into the Rosa. So now let's see is there was preparing the negative number or not. So let's just give a minus sign before this number on sleep the file Good over. Browser on. Reload the page. Now, as you can see, guys, JavaScript is also praying than negative numbers with so javascript very evil number did it . I will treat the number as well as the additional number on as well as the negative numbers will. So keep it in your mind. Double screwed. Really. A bill will bring the number as well as the decimal number and as well as a negative number 10. Variables DataType 2 : Strings: All right, so in this video, we're going to look at the street. So this is good over Project holer and Akopian. Is this the steaming pile over hair and create a walkable call before the day's Jimmer document on through these numbers here on rename this toe strength and right click on this violin operating the note back classless And now I would have to do is I just removed these numbers from this X variable. And remember this thing string means a lineup takes into a variable, so let's see how we can write the string into available. So let's just open the double quotation here and into the condition you can write your text . Keep it in your mind when you write the string, you need to ride into the double quotation because javascript will antique y a string into a double condition on when you not right it takes into the double quotation marks. JavaScript will. I didn't quite those takes as another variable the lizards. Taipower double condition here on into the scores and leads the stripe. Huh? My name is sooner And save the file. Go to our project. Cooler on double click on this filed open is having the browser. Let's see how it looks like. And as we expected, JavaScript will grow in doubt that text into the browser. No good overtakes the leader on Liz. This try another Scranton's into this string. So let's just open and closing our double condition and into this condition. Lizards type. I, um, also, uh, developer. And let's just say the file and go to our browser on because the pig and as you can see, the other script will print out nothing in the browser. Why is a good or takes the reader on? As you can see here we have recon a string on. Then we retain another string into the string on JavaScript will identify nothing because double strip as not most mart as like you. The job script is on defying nothing into this variable and don't print out anything in the Broza. So if you need to for two paragraphs in the one string, you need to clarify it. There is a two paragraph into a string, and then there was capable print out those who fired up as once. So how we can do you find those two paragraphs into a string so you can lizards do, wanting where you stick in paragraph is studying. Before the double condition, you add a best lis and where your second paragraph is ending before the double condition ending tech, you add another plexus and save the file and Google over browser and let's see how it looked like. And now, as you can see, the other script will bring those two paragraphs into our browser. Hi, my name is Jim Nutt, and I'm also a developer. So in this way you can train one string or print multiple string at once into one very room . But remember, when you add multiple string when you had multiple paragraph, you can define those paragraph using laxness. Either JavaScript will not identify your string and north display anything in the Broza, so keep it in your mind. 11. Variables DataType 3 : Boolean: all right, now we know the numbers and string. Now let's see how the bullion looked like. So let's go to our project folder on and Copy and Paste. This external file to create a walk will copy for the external document and just rename this to in next life. And very really, I've been data hyphen bullion and not look on this file on Open it in the north, but Christmas now for bullion. I can discuss this bullion in the later videos, but for now, keep it in your mind bullion, sir, something called who are fourth. Don't worry, I can discuss this true fall or bully ins in our later videos. So keep it in your mind. Bullion is either it is true or either it is false and another to deter days. I will discuss their, which are called truly all day today. One is no, no mean nothing. If extinct, you'll do know that mean execute, do nothing nor mean nothing, and another one is on you find. So this true are called trivial deter types. I can discuss this more in the later videos, but for now keep it in your mind. Julian's are obviously true and false either. Brilliance is true. All right and brilliance is false. On all. On undefined are call trillion digitize. 12. Introduction To Javascript Fuctions: So in this video, we're gonna be learn JavaScript function. So let's just go to our project four year on. Create a walkable copy for this estimate. Document on rhythm. It too. In next. Hi, Susan. Function on record on this file and open it in the note pad plus mus on in here. We just moved is very well from here. Andi, In hair, we just have a clear space to write our function. So what is the function? Ah, function is a group off reasonable court which can be called anywhere in your JavaScript program. This eliminated the need of writing the same court again and again and also save your lots of time. It help programmer in writing, modeler cord and also function allow you to program our divine a big program into a small number of programs. So let's see how we can create function in javascript. So, first of all, you need to type a keyword call function and then give us fis. And then you need to write your function, name whatever name you want, but before the function name you, all of it. So start with dysfunction. Keyword. When you write this funds and preorder JavaScript will identify. This is a function. This is a stripe, something like cool because it's a cool function anyway and posted this function Name you have to do is your friend is his record. Then we have toe open and closing our curly bracket on into this curly bracket. You need to type all of your court and when you call the school function, that court within this curly bracket will run. So lets us try a simple JavaScript alert into this function and tried in the throes of. So let's just state alert aan den open and closing our friend His record on this one disease we're open and closing our double condition into this condition is this type. Hi. I am open something fun on semi colon after this allergy and after this function, we need to call the function. So how we have to call the function. Let's just drive the function name cool and then we need to write down. The friend is record, and then we have to give a semicolon on sleep. The fight. Let's just go to our projects cooler and that would look on this wild. Open this up in the browser. Let's see how it looks like. Now, as you can see here, when you load the page in the browser, a double script L'Art will crop up and the Ellard will see the same text that we can add in this allard box. Hi, I'm a problem. So in this way you can create function and prove your JavaScript, would it? And all the function whenever you want it can save your lots of time. And also it can help you to manage your complex scored in a small parts. 13. Javascript Fuctions In Action: in the previous video, we will learn how to create a function on in this. Really, we're gonna be learned how to use this function in more realistic away so you can better understanding how to use, for instance. So we're just creating a simple but in here on call dysfunction using those wooden. So what happened is we just create a simple but in here, so create a farm on into this formless greater input type. If you guys don't familiar with this form and in courts on in this type of a steam else tags, I highly recommend to take my estimate of course force. So in the type attribute, we just type Burton. This is a button on. We just create value in this value who need to type the text which appear on the burden, which is it's a submit Onda. We need to add another attribute call on Click on in this own click. We just call the school function and let's just change these a lack text toe your home Well , really. Now that's look nice and close the input. Thank on 11 thing we need to do is we need to just you know this called function from here because we're called dysfunction when we can press the button so we don't need to call the function without click the button. So we just remove this whole function here because we don't need it anymore on the could look fine to save the file and goto the Project folder and double click on the Spoiled. Open this up in the browser and let's see how it looked like now, as you can see here, here is the worst of mid burden on when we click this limit burden. A pop up will appear on its that your home will submitted. So this is the more realistic real life example how to use the function in your form or any day for good you want 14. Gobal and Local Variables: All right, Now we know how the contractor walking on in this video we're gonna mylan to type of variables called global. Very well on a local level. So this is goto the project Fuller. Andi create a walkable copy for this estimable document. Bested our hair on. Remembers to in next hyphen variable. I said Google on and local right click on this file on open it in the note. Fact prosperous and most of all, I just removed is really available here. So it was a nice and clean space Children, our next court. So what is global and local? Variable global? Berryville has global scope, which means it can be defined anywhere in your JavaScript on Lucas really real is visible on Lee within a function and also function parameters are always local toe that function. So let's see how it looked like and how to create the global and local variable. Let's just create a very real cost. Let's treat very well called X and then it's cool toe on. Then write a string, uh, Google and then give a semicolon who end this statement. Now let's get a function. Give it a name. Gold Magic then open and closing friend disease, then open and curly bracket. Now create another variable here. Name it at the same X, and then it will do Divers string called local aan den. Give us Chemical. Why I give the same name called this true variable because when I call the X variable inside off the function, it just print out the local takes in the browser on when I call the eggs very well outside off dysfunction. It just brings out the global text into the browser so it can be very, very easy. Toe you guys understanding bodies global, very villain bodies, local variable and how this variable will work. So let's just bring out our X variable. So let's just type documents dot right, Andi. Then we just give it the variable limb called X and then the semi colon. So first of all, we just call the X variable in slide. The function that mean whenever we call the function, it can print out this local text to lift strike. Let's try these in the browser, so let's just call the function, give the function name, then open and closing fantasies. Andi. Then the semicolon. They just saved the file and go to our product, Fuller and double click on this wild. Open this up in the browser and let's see how it looked like on now. As you can see here, it can print out the local text. That means this is a local variable, as you can see here, we can call it inside the function. Now, Eliza, see how it looked like when we call the same very well outside of the function is just cut from hair on. Best it here. So let's just ride in the browser if we repress the fish. Now, As you can see, the takes are being global. That means this is a global variable. So this is how the local and global level will walk in the cha basket. When you create a valuable outside off a function, JavaScript will line in decried. This is a global variable, and you can use it anywhere into your jealousy program. But when you create a variable inside off a function, Javal strip will and defied, this is a local variable, and you can Onley use this variable inside off that function. You are not able to use this local very well outside off your function. So in this way you can create global and local video grill and use it as you want. 15. Javascript Return Statement: holler to in this Really? We're gonna be learn about the return statement in JavaScript. So, first of all, I'm gonna go to my project cooler. Andi, create a walkable copy for the additional document this copy and pasted over here and just women aimed this to in next hyphen return statement and right click on this file and open it in no bad, crustless and now possible, unjust Removed this variable and function from here because we don't need it. And now let's talk about my written statement What you threw down straight meaning jealous region straight man is a function, actually. Is optional function in javascript. It is very useful where you want to return. A value former function on this statements would be the last statement in a function. So let's see how it looked like and how to create this return statement. First of one. This just creative function. Give it a name like whole gram, then open and closing friend asses and then open and closing curly brackets and into the skillet bracket. We will return a well. So listen, Stipe written then who need to type of value is this type of string. So open, enclosing double condition and into this condition. Let's just type the text show Waas Fruit doesn't nice and simple sticks on. Then we need to type the semicolon. And now it's just called the Function Program, then open and closing Francis's semi colons. Then said the file on Goto our project cooler on double Click on this filed. Open this up in the browser and let's see how it looks like. Now, as you can see here, JavaScript will print out nothing because we don't want to declare here. We want to print out dysfunction. We just call the function here. We don't want to tell JavaScript that brain dysfunction in the browser. So let's just bring dysfunction in the browser. So it just displayed this Texan, your brother. So what I have to do is we just got this conscience from here and is this type document dot right then open, including friendless, is on into this fantasies. Let's just call our function program and then semi colon and now sit the file and go to our brother and reload the pitch. Now, as you can see here, it just returned the value. We just bring the value So in this way you can use this return statement to return any value former function. It is very useful when you want to return a value home, a function. 16. Javascript Operators: all right. Now we know how to use the return statement. Now let's see Woody's operators. So, first of all, I'm gonna go to my project Fuller on make a local copy for the estimable document this copy and pasted over hair and rename it to index hyphen operators on red. Click on this file and open it in notepad Plus plus. No, First of all, let's just delete dysfunction from here and let's get a very evil first X. Then it will do. Let's just say hi love, fun. Andi loses printout is very well into our browser. Save the file on Goto Our project fuller. And don't look on this wild. Open this up in the browser and let's see how it looked like now, as you can see, it's print out the qin It actually not print out five plus five takes. It actually print out the quite Plus five value, which is 10. So this plus sign is called Operator. Now let's say you want to multiply this five and five. So what I have to do? We just add star instead off this plus and save the file goto over brother and reload the page now, as you can see, here we have the value right into five is 25. So in this way we can use this operator. You also have operator called miners and save the file Goto over browser on reload up it. Now we expected five minus five is zero, so it will display the zero in our browser. And if you want to divide, just add a slash. Let's say we have 25 divided by five on. Let's go to our browser and reload the page. Now let's see how it looks like now as we expected it out. Put the fight. So in this way you can use this operators inch Allah script. Also, let's see this. A burger is actually working with the dissonance numbers or not. Let's just live here. 26. Divided by five on. Let's see how it looked like into your browser. Could our browser and reload the pitch? Now, as you can see here, it's also working with the dismal number. It just give us the output. Five door to Andi now lives a strike. A model is operator. There's just add a person insane instead off these division and let's see how it looked like indoor browser, said the page and goto our browser on Reload the page. Now it give us a one. So in this way we can use these operators on one more thing. I will show you where is, which is called Something like Implement and Dick lament operators. So let's say we have a very well which hold 26 value. Now we want toe increase this very well by one into our brother. So what I have to do is we have just Stipe the available number on. We have to just type the plus sign twice. And what this does is it just increased this value by one. So let's stick it in the browser, said the file and goto our browser on Reload the page. Now, as you can see here, we have drinky seven output into our browser. And if we just change this value to doing this statement, or let's say doing the eight and save the file, go door Broza And it just reversed 29 we also have a Dick Clement operator instead of this double Plus, we want toe add double minus on, and what have to do is sit the file and goto our browser and we load the page. Now it give us a 27 value, which is a Dick Clement by one in this value. So in this way you can use this inclement and equipment as well. Don't worry, guys. When I teach loops in later videos this inclement and document Wilmore woman into your guys . But for now, keep it in your mind. You can use this type of operators as well. 17. Javascript Assignment Operators: hollow to anyone previous really will learn about operators on in this video. We're gonna be look at the at sign operators. So first of all, I'm gonna go to my project Fuller on and copy and paste this estimate. Pile over here and rename this true in next. Hi, friend. Assign ment different operators on rightly on this file and open it in north back. Crustless, first of all would have to do is we just remove this court from here and create a new really a bill going. Why on give it a value, something like he live in on. Then we just print out the value into her brother. No common dot right? And then we need to enter the variable name, which is why on then we need a systemic alone. Now save the file. Go to our project for little will become this file. Open this up in the browser on now it print out the value, which is 11. Now, let's try assignment of murder over here. So let's say we have to add four with this element. So how we have to do that who just simply give us stays, then give a plus operator and then tie four and save the file and reload the page. Now we have the value, which is script in. But we can do this. We can add this value with another way. How I can show you how first this is. Give a enter and let's type the same variable name. Which is why then were duped I plus, which is our operator. Then we need to give us a sign sign. Then we need to add the four. Then we need to add the semicolon and slipped the file. Go to our browser on Reload the page. Now it give us the same value. So if you want to do like this, you can do that all you want to do like this. You want to do that. But this call assigned a birder. First you have to add your operator than you need to assign those with a new value. So it will just add those value into this stain variable because we are a sign this value in tow us name virile. So this line phase first creative variable and put a value element on it on the next Lenz. They then add the core into this 11. And when we print out this, why variable it just print out the value which is scripting. So in this way we can create your assigned operators. You also can assign minus sign just did the violent good over browser. And now we have seven. So it will just minus four. From this element on, the result is seven. You also can multiply this. It also can divide this. And also you can moralist this as well. So in this way we can use this a spine operator as far as your project need in JavaScript. 18. If Else Statements: All right, so in this video, we're gonna be learn about something called FL Statement. So first of all, I'm gonna go to my project Fuller and copy and businesses to milk. Welcome hair on. Rename it to index hyphen. Do you hoping pills, hyphen, statement and wreck. Click on this file and open it in north for trespass and first herbal. I'm just removed this variable from here because we don't need it. Andi Now list a cold. He feel statement. You feel statement? Actually, you can tell JavaScript to make a decision. It works something like this. You can tell Joe Skip something like this. If this is true, then print out this program into the browser. And if this is fall, then print out another program into the browser. So let's just create a symbol evil statement here on Let's see how it looked like and how it walk in javascript. So, first of all, I just create toe really wills over here. Let's just create a Greeleyville X and then give it a value, something like 11 on, then honor next land and create a new variable called y on. Then give it a value. Something like 19 and after that is just create a if statement. So if statement is always start with the if keyword solicitous type. If then give the fantasies on, then give the curly bracket. So if the condition is this, the condition will go into this trend is racket and if the condition is true, then run the program. So what type of program is run when the condition is true? Is going toe this curly bracket? So let's just try a simple condition over hell is just type here x, then double cool too. Why why we need to add double equal here because we already walking with a single equal signing toe are variable. So do we makes your that JavaScript will identify the exact value off this true very will you have to add this double equal sign here it mean match the x and y value exactly same or not. So if x equal to why run this sticks. So let's just print out some text. So let's just add document Dordt, Right. Turning to this document that right in the double condition, we just add something like X is equal toe. Why? So if x equals toe. Why that mean X value is a called a wife value, then Trent out the Sticks X is equal to why in tow our browser. And if this value are not the same, then print or nothing simple. So let's just say the file and it is this programming tor browser. Let's just go to our Project folder and double click on this file. Open this up in the browser and let's see how it looks like. So now, as you can see here, it brings out nothing indoor brother. Why? Because the X value are not same as the y. So let's just add the same value into this true, really, Even which is 19 and save the file and go to our browser on Reload the page. And let's see if this print out the stakes are not. So. This is reload the page, and now it brings out the Value X is equal to why now, as you can see, if this value are true, we can only print out districts into a brother. And if the value is falls, we print or nothing in for Rosa. But I want If the value was falls then we also print out something into our brother. So how we can do that now it's come to our ale statement. If this value is true, then print out this ill. Then we need to open and closing our curly bracket and into this curly bracket we need to add our fix, which is X is not equal toe. Why? So what this program does is if x it will do. Why means X value is equal to why, then print out this fix, which is X is equal to why on, and if the value are not true, that mean X value is nautical do. Why then print out this sticks, which is X is not equal to why it working something like that. If the condition is true, then print out this value else. Print out this well, so let's try it in your browser. Stepped the file and go to our browser and reload the page. Now it can print out X is equal to white because eggs variable and y valuable value are the same. Let's just change this value. Let's exchange this extra 16 and why to 19 and print out this value in tor browser on Let's see how it looked like. And when I reload the page now, it can say X is not equal to why that means it can print out this Ailes value. So in this way, you can tell Joss Skip to make decision for you using if an else statement. And also one more thing. This condition is not limited. Toe this equal sign. You can use exploration sign and equal sign which refer toa not equal that mean, if x nautical do, Why didn't print out this value else? Print out this value you can also use getter than or Lisbon sign. So in this case, JavaScript will read this court something like this. If X is get it, then why then print out this value else, print out this value you can also use. Listen, sign as well. JavaScript will read discourse something like this. If eggs value is less than why then print out discord else print of this court. So in this way you can use this if l street men in your javascript 19. Javascript Switch: All right, so now we know what is. If l statement on in this video, we're gonna be Look at the switch. So this is good or project cooler on dcaa p. And is this a steaming pile over hair and renaming to in next hyphen? Switch on record on this while and open it in north. Back plus plus. So now let's say we know how to use the full statement, But let's say you want a multiple, even ill statement in a program. Let me a straw. You first how it looked like now, as you can see here we have some couple of lineup. He fell statement, and it gives us the same output type as we want. But this is not always the best solution, especially when you hold multiple of values on a single variable. So now in hair, the switch coming which will handle exactly the situation and it does so more efficiently. Then they're repeated. If l stedman the first of all, let's just create a simple switch and take a look at how it looked like and how it works. So, first of all, I'm just delete this reported line off vehicle statement from here. And we just live with the single really will which called X on. Let's just change this value to a stream. We just type red. And when you start opening a switch case, you want to type the keywords which is rich on Ben. You have to open. Your friend is this. And then he helped open your color bracket and into this friend disease you have toe type the very real name on nothing else. Execute. So that or why you called so that it is not like that on into this curly bracket. We just type some cases which hold our values. So type our cases. You want to type gifts, then give us space. First we type the world called red and instead off semi colon. We just live here Colon on in the next line, we just die document dot Right, Andi, into this friend Aziz, This open our double quotation into this conditional is just type. This'll is read on. Give us Temic alone. After this, Document it right on. Let's just type one more thing, which is Brick. I just tell you in couple of minutes why we type break after this document. Not right. And let me just copy this case some couple of time. One, then I need another one. Then we need another one, and that's it. And change this. His name do One is blue. Well, the change here. You, um the you low also hair you as well on then black, um, like as well on. Just give some species so looking nice and pretty All right, so let me just explain this court hair. So we have some couple of kids under this rich, and what switch does is which find the world within this variable X, which is red. And when they find the world they can display, this sticks into the browser. And this is the simple program. So why we add the break after the old case? Because when the switch find award that we're looking for, they can stop the program and don't goto the next lines so it can save your lots of time. That's why we can add the Breaky Ward after the cases. Let me just show you. Let's just change this cure toe blue. So when the switch find this blue ward because we're targeting eggs variable and eggs very well. Hold this blue world. So switch is searching for blue. And when they can find this blue into this second case, there does not go to the third and fourth case because they are find our ward. And when they find our ward, they can display the steak. This is blue into your browser on bacon. Break the program in this line and does not go through this line so it can save your lots of time. So that's why we can add this break cured after the all cases. So let's just try this simple program into your browser. Let's just save the file and go door project Fuller. And don't look on this file and open this up in the browser and let's see how it look like now you can see, as we expected is just display their text Indoor browser. This is blue. Now listen good or takes a leader on, and let's try something different. Let's say we have a value into our very well that's does not include in this case. It's just type. One more color here that does not include in this case is I agree on this curricular is not including this cases, as you can see here for stone is red and blue, then yellowed and black. And there is no great cases, so switch will not find this great value into their cases. So let me just show you how it will displaying to the Broza. So sleep the file and goto our browser and reload the page and let me show you how it looked like. And as we're going to see here, it display just nothing because which will find nothing value into their cases. So they will display nothing into our browser. So in this case, I only saw something into the browser if which will find nothing value into their cases. So let me just add a default takes for you, which will apply when switch will not find the value into their cases on that should remember that default value is your last line into your switch so you can write your cases . Then you can add a default value. When switch could not find the variable value into their cases, they will display that before takes or default value into the browser does the point. So now let me just add it to call value into the stretch. So if you want to add it, the fall fairly windy will switch. You just type the key word default. Then you want to type a colon, not a semicolon colon as like the kisses on. Then you have to write down the document dot Right? Let me just copy this document that right from hand tested over here and changed the sticks to Saudi we could not find in color. That's look nice. So, as we say, when switch could not flynt this value into their cases, they can Onley display these default takes. They can display this deported taken into the browser on As you can see here, we do more at any brick into our default because I already said before default is your last line. Default should be your last lining switch, so Wednesday's did not find the value into their case. They can display that before text. So, as you can see here, we try with a different color, which is the different value. This does not include in this switch cases, so we hopefully it can display that before text. Let me just try it in your browser, save the file and go to our browser and reload the fish. Now, as we're going to see here, it is rather take story. We could not find any color. So in this way you can create and use switch in JavaScript. But you should remember that, as I said before, your default takes or your default value should be your last line into your switch. Andi also, it does not record any break keyboard because this should be our last line. If the switch will not find the value into their old cases on Lee, then they can display the default text, so you should remember that. 20. Javascripts Loops : For Loop: All right, so in this video, we're gonna may learn about something called looks. Looks are very important. And very you school when you want to repeat something repetitively So, Mrs Goto, my project fuller on goingto copy in his nest Immel file over here and rename this to in next heist Man four hyphen Luke. Because we learned for Lupin this video. So I'm just right Click on this file and open ating. No back plus plus. And first of all, I'm just delighted days switch home here, so let's just create a simple example for you. Then we have to start the whole new note, right? I love rate cooler. All right, so now let's just load this page in your browser. So let's see how it looked like on don't go on this while companies of in the browser and as we expected, is just bring out the text into our browser. I love red color. Now let's say I need the sticks. Ah, Kenton. So how we can do that? We just go over text editor and copy this document Not right on bested here, Stendardo and save the file and go to our brother and reload the page. Now we have some couple of mystery takes over here, but this is also look very messy into our quarter here as well as you can see here, we have a couple of some document that right document. Right document dot Right. And it looks also unprofessional. So there is another way to repeat this text. Repeat any type of elements. Any type off tens in charge, a script which is a for loop for look and help you to repeat anything. Do any number of time. Just type being one. Sing a line. So let me show you how to create a four look. You want to type the key word for then give us this, then open our friend of this on Ben U S space and then open our curly bracket on into our curly bracket. Is this type our document dot Right on we take this name takes indoor document dot Right, Which is I love rate killer. Then give us chemical enough that this document, right? And into this four loofa entities, we just add a couple of variables over here on. Remember this thing for Luke? Want some variable to work So you want to add some very well here to work with this call you. So let's just add a y variable over here and let's give a equal sign and then I just add zero, because in programming number, start with zero. So why he called to start with zero, and we need another perimeter over here, which is why is less than you live in. So what this still of browser is friend of this line? Whatever time either it will reach less than 11. That means his tender in the standings listening 11. So this line will print out 10 times in tow, our browser. And now we need to add another perimeter over here toe automatically increase one line after this zero because this line will start counting from 00 than one, then two, then three, then four, then five on that will print out this line Either each will reach less than 11. So we need to hair at another perimeter which will automatically increase our line. Whatever, this text will restore less than 11. So this parameter is called. Why Plus plus, as you can see in the previous video, this plus stress will automatically increase one number, as you can print out in our browser, so this will automatically increase a line whenever this text will not reach to less than element now. A listers had another thing here, which is a line break because we want each and every line separated for mothers. So let's just aired online break after this ward on a B, uh, giver Andi. Then save the file on Goto our project polar and double click on this wild openness of in our browser. And let's see how it looks like. Now, as you can see here, we're just print out the 11 lying Tore browser. Why we print only live in lining Tore Rosa, I can tell you before we air printout just only 10 as I mentioned before in programming numbers are started with zero. So in this case, it will print or something like that zero, then one than tooled and treating four kuip, 6789 10. So in this way it can trained out that 11 line because coastline is counted at zero on the last line. Counted as Stine, so it will print out that element line on if you want something like 50 line. So how you can do that? Just change this living to 50 or whatever number you want. You also can print out thousands of lines or whatever number you want. Just put it over here, and it can print out those line into a browser within few seconds. So in this way, you can create for loop on, use it in JavaScript. 21. Javascripts Loops : While Loop: All right, so in this really we're gonna be learn about while you So first thing first this good work with your cooler and create a workable copy for this. A Stina document and 52 were here on Rename this to in Next Life in Why loop dot a steamer on rhetoric on this file and open it in. No trust us. So first of all, I'm just removed this or look from hair. Now let's talk about the wild Blue. Why Luke are the same as like the follow Actually, loops are the same kinds, but this is a different loop, so it has difference in text and perimeters. So let's just type our why look here and just reading or browser. So let's see how it looked like. So, First of all, we need a very well to working with a while loop. So listens. Create a simple variable of war and give a why name, then equal do on in hair. We need to put the value. Let's just go. The simple valuable it's ah one. And we need to start of a while loop. So if you want to type your why look, you want to start typing the key word while then you have to open your friends. Is this record. Then you have to open your curly bracket and into your apprentices record lizards type. Why lays then then and into your curly bracket? Let's just print out something. Let's just time document dot Right on into this document. Don't, right. We just want to type are very evil name, which is why then if you want to add some text, you also connect the text. Just give us strays than at a plus because we are adding that text with this variable value . So you have to have a class sign, then give us space, then open your double quotation and into a double conditional is just have something like dime love recordings. So we have to Taipower takes over here on. Then we have to open up lane record as well. The, uh and that's it. And we need to add another thing which will automatically increase by one for this document . That right, which will Why? Plus Plus, we don't want to type this y plus Plus, in this Prentice's record, we on toe type this after this document that right inviolable and then slipped the file on Goto our project folder and double click on this Wild Open this up in the brother. Let's see how it look like now you can see here while will print out this document Not right nine time because we are adding here. We want this value. Either it will reach less than 10th. So nine is less than 10 and when it will go to the 10. So why liberal identify 10 is not less than 10. 10 is actually equal to 10 while loop will stop. So when this value will reach out the nine time if you add 20 in hair so it will print out this value 19 time Because we are I need this value less than 20 times 19 is less than 20. So it print out the 19 time this value into our browser. So in this way, the while you were working in javascript and you can create this wild loop and use it as they want 22. Javascript Loops : Do While Loop: Alright, guys. So now we know why. Luke for loop. And in this video, we're gonna learn about do I look so first thing first, let's go to our project Fuller. Andi, copy and busily stimulate document here and rename this to do. Hi, friend, while I felt low. That's very nice on right leg on this file and open it in north back plus Plus. Now what is do? Well, you do. Why? Luke are the same as like the boy, Lou. But do I look print out something before they want to test a court as we see previously. Inviolable in for follow. First of all, the while, loop in for loop will get something than print out into our browser. But for do well loop, it can print out something into our browser. Then it can be test out our core. So let's see how it looked like. First of all, understand movies. Why look from here and we can stick with this variable because we need a variable toe run. Our Do I look, Andi, I just do this one thing. I just do a simple change over here. Just change the value toe. Something like to like. So now let's just Taipower do well. So you want to type you, do I? Look, you want to start with the keyword do, Then you have to open your curly bracket. We don't need any fantasies there. We just need the color bracket, then into the car. Live record. Let's just I document dot right on, then the Francis's record and into the franchises record we have toe written our Viva. Why, then you also gonna add some funny texts with this wife value, so they just add something like time high on. Then we also add Viet Dag after the text. No, we have to write a stem ical enough to this document that right? And now we have type. Ah, while you. So let's just type while Andi then who have open your friend is his record. And in hair, we have toe give something which will noticed this loop. Let's say, why is Liz then 10 and then we have to write our cynical We don't need any more curly bracket after this while and also we need to add another thing which will increase this document number by one, which is the white plus press. Andi, sleep the file. Go to our project. Fuller on Don't look on this world. Open this up in the browser and let's see how it look like now. As you can see here, it can print out the value, either ritual reach nine. So to time high, because we start with the two so it will print out to first. So to time high three time higher to nine time high. So what this court till the browser discord until the brother first print out this value into our browser, then test out this wild condition on, then print out those value. Either it will reach the nine because we want the Y value. Listen 10. So it will stop the program when it will raise to nine. So I just show you something, which is pretty much interesting. Let's say we need a value hair, which is a getter than then. We have distant here, so if we using for loop or while Lou, it will print out nothing in tow a browser, but for do while loop, as I said before, it will print out something in your brother cause then it will taste the condition. So let's just try the same thing, which is? I just put something bigger. Hair, which is 12 12 is obviously bigger than the 10. So let's justice this court indoor roser and let's see how it window into our brother listens Goto our brother on Reload the page. And as you can see here, it bring doubts still, 12 time high. Why? Because, as I said before, it will print out at least one lining toe a browser dentist, the court so it will print out the value first in your browser. Then it will does the scored. Why is within 10? And, as you can see here, why is already legal to 12? So it went out Nothing after this document that right after this first line, so it print out still of one lining door browser. So do I. Look, it's pretty much helpful when you will print out something before you want to taste your court. Let's say you want to print something before the page Lord using JavaScript, but you can use this. Do I look toe print out some text like your Villager will cost. See that takes your pages loading. Then the bridge will lower something like that. So this do I look will helpful when you print out something before you want to taste a court. So in this way you can create your do I loop and use it into the JavaScript. 23. Javascript Arrays: Alright, guys. So now we learn how the loops air walking in JavaScript. So in this video, we're gonna be learn about something called a raise. So first thing first, let's go to our project folder and copy and business fell over hair and renamed it to Index . Hi, friend. That is on directing on the smile and open it in north back plus mus. So first of all of this is moved. These do while looks for mayor because we don't need it on now. A list of old bodies areas It is our pulled multiple values in a single video. Let's say you have a variable over here. Let's get a reliable simple enough making a name for its Andi Make of value like 24 and Liz , this friend out this very willing your browser. No, carmen dot Right then, variable name on. Let me go on after Bend, save the file, but our project cooler and double click on this file it. Open this up in the browser on as we expected. It's a sprint out that 24 which is the value for this variable. Now let's say you have some multiple very well over here like 24. Then you have 48th and 59 57 60 or whatever values the one. Let's say you have some multiple fellas over here and let's just print out this indoor brother and let's see how it look like you said the file and go to our brother on Reload the page. Now, as you can see here, we print nothing in browser because javascript will confuse. What the heck is this? You have to print 24 or praying 48 or 59 57 60. What type of value you want to print in your browser. Now, in this case, double script will have the areas that is will help you to store multiple values in a single Really, really. So let me just create a simple Eric for you. So it will riveted to understanding he was how there is a walk. So before you want to create an area, you obviously need a variable. Then you have to give equal sign. Then you have to type in either blue, which is new. Then you have to type here a use capital war, then doubler a why, which is Very. And as you can see here, I just capitalize That e later. Javascript is case sensitive. So you have to be careful in there. Whatever you have to type small later or Capital letter and is are all small letter instead off this, the leader the leader are in caps. So remember these guys Now we have toe open our friend Mrs Racket and into this Prentice's we have toe type our values. Let's see, Let make it more logical lives the giver. Very well named two names eso provide him name on. We have to put some names in these areas unless of excess. Those name indoor browser one by one. Now let's just axum names into this area. Just add a false name, John. Then give a comma. Then you were singing name Anna. Give a come up and then give 1/3 name. Rick. Andi, that's it. Now you go ducks me. We have three names into this very vehicle name. But how we can access each off this value. Like if I want to access the John how we can access the John Value because we just print out the variable name. So if I print out just only the variable name it print out. Nothing indoor browser because we don't indicate javascript toe print out exactly this value because this name will hold three values, as you can see here. So how we can access those three values separately when you put your values into the airy and we will identify each values, like at a index. So this is in next one. This is in next to this is indexed tree. And when come to the computer program computer program are always start with deal, as I mentioned before. So in this case, this is zero. This is one on this is true. So if I want to access that John Value I want do type here first is name, which is a variable name. Then we have to open our square brackets and into the square bracket. We have to give the next name, which is zero, because we have to access the zone value and John Index is zero. As they mentioned before, computer program are always start with zero. So this is zero and this is one on this is to let's just change this name. Very real names. Now it looks larger, girl, because we hold more than one name, so names this pretty good. We also change here names as well. Now save the file. Now go to our Forget Fuller and double click on this file to open this up in the browser and let's see how it looks like. Now, as you can see here, it just brings out John as we expected. Now let's see if I want to change the index number. Tow something else like, let's say I warned Output the Rick name. So I just want to change this to two because Rick in next number is 201 to so Rick Index numbers to. So save the file and go to our browser on Reload the page. Now, as you can see here it out, put the rig. So in this way we can create a variable and hold as much value as you want. Using air is on in this way. Also, you can create Aeneas and use it in Joe's group 24. Associative Arrays: All right, guys, the previous video will learn about that is now, in this video, we're gonna be learn about something called Associative s. So first thing first, let's just go to operate Fuller and copy and paste this while our hair and changed the name to and so sensitives that is on record on this while and open it in north back plus plus. So, first of all, I'm just telling you, Associate E Berries and Cherries are the same. It's not too different type of errors, but in associative areas you can change the index name as we previously seen that Harry are have some index number and we can target the areas values using those in this number like 01 True, but in associative at is you can actually customers this index number toe text. So let me show you how we can. She ate s sensitive areas and how to change this index number to our custom text. So, first of all, what I have to do is just remove this document that right from here, because we don't need it on remove this values from hair as well. And if you want to type associative area. First of all, you need a variable. Of course, So you want to type of Our war is referred to variable. Didn't keep a very well named an equal to you want to type new Ari as like the same when you say that it is. And of course, the ease cafs Then you have to need your friend is record that you have to need your semicolon on. You don't need anything in this restaurant has its record on then given. Enter and go to the next line and then type the variable name names, then open and closing your square bracket and into the square record. We need to type our index name. Let's release type color and then give a cool sign on. Then when type our value, let's dyed red because I love red color. So I kept it. You want to dive anything in this value? Then we want to type our stomach alone. Then, after the next line, let's just at another index name with another very Let's just dive the same really even names names, then open and closing your Squire record leading to the square record. You have to open your double condition, and this double condition is just time hobby. Then give a Golestan. And of course, you need a value which associated with this how b index name. So let's just right photograph e. I love for the gravity. So stay photograph E. Then after that, just died a semi colon. Now the big question is how you have access those index name which associated with this very so. First of all, let me just hoping that document dot Right then, over in the fantasies and after that and a semicolon on into the sprint of this, we have to give it their name off the variable as like the areas names. Then we have to open the square record and he prescribed ragged. We have to give the index name. Let's say we have to give the next name core color so listeners type color, and that's it. When you ride the color, it will display the red value into our browser. So let's see how it looks like state the trial goto our project folder and double click on this point open deserving the browser and let's see how it look like now, as you can see here it just cleaned out rating toe our browser, as we expected because the color index name holder, red value. And, of course, when you type the indignant hobby, it will print out the photograph in Tor browser, legislative it and go to our brother, your puppet. Now, as you can see here, photography, our printing. You know, Herb Rosen. Let me just give a quick example how to use this associative Harry within the text. So let's just Axum paragraph with this necessary varies. So let's just have something like my hobby is then give up, plus sign toe Add this variable with this string So save the file on goto our browser and reload the page. Now, as you can see here, it can print out my hobby string with this variable which hold of value photograph now, as like the same way you can print down something like I, um then change this hobby index name too color and save the file and go to our browser. Just cancel it on. Reload this page. And now, as you can see here, I love red. So in this way you can create and views Essel City areas in Joe's group and change your at is index number who text 25. Introduction To Javascript Event Handlers: Alright, guys. So in this video, we're gonna be learn about something called event Handler. So first things first, let's go to our Project folder. Andi Copy and Paste Disc. Wild from here. And just rename this Wild to Index. Hi, friend. Event handlers and likely on this file and open it in notepad plus plus. So first of all, I'm just removed this. It is from here because we don't need it right now. And no, let's talk about what is the manhandling event handler will handle all type off events. That user can take action. That's right. So when the user click on a button are, let's say when that users have made a home, even Handler will earn a JavaScript code. Something like that. If you feel up registration form and submit the race station home, then you probably see a black box will pop up, are another page will say that your races inform was submitted. That is happening. The help off event handler. So let me just try a simple event handle over here. So it was elevated to understanding us out. The event handler will working in Dallas group. So in the body, we just create a simple Burton. First, let me just open our form back from then like the closing form tag. And in the corn back, we just add a simple burden. So let's just open our input today on a second. Guys, if this palm tag input tech is unknown to you, then please take my esteem. Ill course, it will help you toe understanding. Would this form tag? What is in protect and what type of this stag are using in a steam to create which business ? All right, so input. Then give us space. Then we need to type. Then just stand here. Button their unit were a value this state submit. Then we have an option to add evened handler into this form. How? Let me show you how it just first close this input back. And after the value, you can write a even handed Eliza Stieber human handler here on click. So this is the inbuilt JavaScript event handler, Actually, even handler our in built in javascript, so we don't need to create any event handler for us. Then run it. This event handler are already created in javascript, so we just use it directly into our HTML. So this on click is Ah, in visual JavaScript. Human handler, We just use it into this. Burton. So what is this? Does this Does this actually run the javascript cord when someone click this wooden? And as I mentioned before, JavaScript is guest sensitive. So please look at the sparing. First on is all small later than we have. See in gaps then other letters are small on. You have to type the own click like this. Either way, the browser will not identify. This is a journalistic, even handler. So let's just try value here, even on click. Let's just try a simple allard box here a large, then open your fantasies. And in the Allied walks, we do not could double condition because we already put double condition into our attributes. So we are using single condition instead off this double condition. So it will be better and easy way toe. Tell Javascript that this is the function and this once and have a value which is in this single condition. So we are adding the single condition into these fantasies and they just type some sentence over here like your form has bean now that's look nice on after this went as it is, as we create a statement in javascript, we add a systemic alone that will indicate the javascript that this Allard are ending her. We just misspelled this a lot of ward our hair as I see her. Dispel ill e are tee. Now, save the file and go to the project Fuller and double click on this wild. Open this up in the browser and let's see how it look like now, as you can see here we have our button over here, and when we click covered in it will pop up a JavaScript ballot box. And that will say your form has been submitted. So in this way you can create and use your JavaScript, you and handler into your ace, Deanna. 26. onMouseOver Event Handlers: All right, guys. Toe, welcome back to your another video in the sauce keypad, once tutorial into our previous video will learn about some basic type up, even 100 like, own. Click on in this video. We're gonna learn about some DuPont's type of even handler. So let's get started on Bursting coast. Could work with cooler on copy and paste this coil over hair on. Rename this to in next hyphen even handler hyphen on Mose over because we learn about own miles over event handler in this video. So ridges, right? Click on this vile and open it in no back plus plus. And now what happened to is just removed. This form elements over here because we don't need any form elements that were here. And now let's talk about on mouth over even handlers. So what His own mounts over event handler on most of, or even handler are actually active when you have to mouse over on some object? Ah, let me just clear to you. If you go to our website and just hook on a button are gonna link, you'll probably see a pop up. Will say this is thes type uplink. What This is this type of thing that happened just because off even Handler. And in this video, we gonna be learn how to create those even Handler. So let's just create a simple link element over here. Let's just start with the ANC. Attack lives this time A then and surely Yes, it called to. Then time a suiting B colon he google dot com on it's supposed to full just close this and good tank alike. So in the tank attack, we're just at our own mouse over even Handler. So let's just type on miles over now. As you can see here, we're typing on most over, like own is small than M iss caps then or you S E is small than always caps and then VR is small. As I mentioned before, JavaScript, it's case sensitive. So you can written this on Mount over Event handler, This is actually in beauty. Job was keeping the handler. So you can written this as like this one. I can return it over here. All of us remember him and all our guests. If you don't written a more or in caps, it will not work perfectly. So keep it in your mind, as I always be saying previous videos. JavaScript is case sensitive so we can retain our even handle it and given equal sign on then type, double condition and into this noble Kardashian. We just tied Boston Pill Alec How much? Then Francis is on into the country's Let's just open a single quotation on into this condition is just type something like Click the Link tool. Go to the Google website. That's look nice. So when we who were on this link the ballot will pop up, click the link toe Goto the Google What side? All right, so we're just donating our even handling now. Accident text. Let's in. Google taught home, so it's pretty nice. So when you over on this link, the ballot box will pop up, and that's a click on the link to go to the Google Web site, which will look more user interactive. So let's just save the file and go to our project Fuller and only on this file to open this up in the browser. Let's see how it looked like now, as you can see here, we have the lingual dot com, and this just watch carefully when I who were on the link, so I just take my mouth onto the link on. As you can see here, JavaScript ballot box will pop up, and that's a click on the link to go to the Google Web site. So this is pretty nice. So in this way you can create this own mouse over even handler into JavaScript. Not only the link properties, normally the ankle tag. You can create it on any esteem, ill property as you want. 27. onMouseOut Event Handlers: Alright, guys. So now we know how to create own mouth over even Handler. Now, in this video, let's gonna be learn about own mouths out. Even handler on miles over are actually working When your home or on something on on most out are working when you leave your mouth on something. So this is go to our project Fuller on. And she ate a workable copy for this esteem. A document. Just copy and paste it and rename this to he lives hyphen. Even Handler high fell on most out and writing on this file and open it in. No, but most of us. And no Liz astray on most out on the same. Thank you, Jay. But instead of this own mouth over, we just Steiff here on mouth out. And just look at the own mouth out. Spelling, as I mentioned before, the casket is case sensitive. So you have to be very careful when you retain small and capital letters. So in almost out, as like the previous one on most over the M And who our gifts. So when someone is out off their mouth into this link, the alert box will pop up and that will say some different methods. That's a ah, don't you go flick and the link. Let's do Please don't go click on the link. Uh, it's look pretty nice. Now Save the file and go to our project. Fuller on double click on this pilot. Open this up in the browser and let's see how it locally now, as you can see here, the PD's loaded on. We're with the same lingle dot com. Now Watch it very carefully when I hope we're on the link. It's just have been nothing. But when I live my mouth into this link, why it's not just happening. Let's go back to our text editor. Andi, look at the cold hair on mouse Our I learned. Oh, actually, it's not happening just because up we're giving here three single condition. So JavaScript may be confused with this. She single condition. Let's just remove this condition from Don't on. Let's just I do not on Dsev the file. Then go to our public fuller and refers the pitch. Now take a look at this. When I hold on the link, it just nothing happened. But when I remove my mouse from this link, a JavaScript ballot box will pop up, and that's a please do not go click on the link. Andi, that's does not happen previously. Just because up as I mentioned before, javascript is case sensitive. So you have to be very careful when you use this double condition, single condition, as well as when you use the small later as well as the capital later. So in this way you can use this own mouth out. Even handler, In any case, TML properties. 28. onLoad Event Handlers: Alright guys. So now we know on mouth over on most out, even handlers. Now let's talk about some more advanced. Even handler, which will include in the border dig. You just cannot put any type up, even handler into the border. It does not work as well. So there's some specific even handlers which including the body deck. So in this video, we're gonna learn about some more advance even handler, that will including the body. So let's just go to our project Fuller and copy and business while over here to create a walkable copy. Now remember this too in next hyphen even handler hyphen on Lord, we'll all Lord is even Handler is a curia and wants event handler which will including the border. And in this video, we're gonna be learn about the on load. So right click on this coil and open it in notes. But plus plus And first of all, let me doesn't milk this even handler from here because we don't need it right now. And let's talk about the all load even Handler. So what is the only word? Even handler, How it will work all Not even handler will work when appeared will lower it completely. So when I put this on load even Helen Door border tag, it will work. It will trigger the court which including this own lord, even handler. So let me just try on load even handling to our body tag and let's see how it will work and how we'll create all load, even handling our body. So let me a stripe on Lord. And as I mentioned before the Boston Police case sensitive. So please be careful when you return the event handler as well as the other journalistic function into your estimable court. So please be careful on your spilling and on your small and capital later as well. So, into this will all Lord, there is one capital later which is ill on other are small later So keep it in your mind, please. So, into this on Lord Legis, add equal sign after this own lord even handle it. Then we just add the double condition and into this double Goodison, we just add a sim pill Alli the box a lot on. Then we open our friend Is this on? After that? We just had our semicolon on into the spenders that we just had our single condition into this condition. Let's just add something Bill takes in this ally. Divorce is just straight something like this. Welcome to uh, who wants that for any day work Fix as you like to put into his Allied bosses. So just said the file and go to our project Fuller and double click on this wild openness of in the browser And let's see how it looked like. Now, as you can see here, when the pages loaded completely, the JavaScript lactose will pop up and it's they welcome to the website on when you click. OK, it will just gun again. When you reload this pitch, it also pop up the same thing. Welcome to the website and when user click OK, it will just done so in this where you can add a simple welcome message when someone visited your site. So this way, all lord, even handler are walking in javascript. You can create this own lord even handler into your border, as we can mention before into your body that you just could not put any type of event handler Onley some specific event handler, You can put into your body. They're going door. Next video will talk about another at the ones even handler that we can, including your body take. 29. onUnload Event Handlers: All right. So indoor privies will you will learn about event handler, actually, advance event handler, which will including the border tax, which is on Lord. Now, In this video, we're gonna be learn about another had once event handler, which will include in the more knitter riches on unload. So let's just go ahead and go to our project Fuller and create a walkable copy for his s demon. Document this copy and pasted over here on Reckless on this Andi renamed this file do in this life and even Handler happened, My lord. Um right click on this violin. Open it in our no bad last month. And as we see in the previous video, will use the all Lord even handler, which will run a javascript cord when user lorded a website on when the website is completely loaded. A javascript cord will learn through this on lower even handler. But when it's come to unload even handler, it will Laura Java script court. When he will try to close the website or when you try to live the weapons then the unload even handler will learn a javascript court. So let me just try on Lord even had laying to this esteem ill and just teaching you guys how to use it and how to create it in your chalice script. So instead of this on law, I'm just I've here on unload, and as you can see here on Lee, you is the caps on other later are small. And as I mentioned before, JavaScript is gift since the deep So please be careful when you written this functions. So now listen to this Eller to, uh, let's say something like, Hey, don't go or something funny stuff like this. Now, save the file on what this court is does is when someone wanted to leave your website there will first see a pop up and the pope of say, Hey, do not go to the website before we gonna try it into our browser. I'm gonna tell you something. This own unload JavaScript, even handler are not supported in Morton with browser because more than with brother are skipped. The unnecessary exit for puffs on and I don't think so. This own unload will support it on my brother as well, because my brother are the latest grocers, so I don't think so. This function will separate in our browser. But still, I'm gonna go to my project, Fuller, and test it for you in your browser. But if this is not supported in your brother, don't think that this is not the correct JavaScript. Even handler this own unload easily. JavaScript, even Handler. And it will does the job as I mentioned before. So you can test it and try it in your brother, is it is work or not? All right, so let's just go to our project. Fuller Hand double click on this file and tried in your browser. And let's see how it looked like now, as you can see here, the page well ordered. And if I want to try to close the browser, if the own our Lord function will support it into our browser, but I don't think so, it will support it. As I mentioned before, I have the latest brother letters version of browsers, so it will not support it into the latest version of browser because the browser wills keep that exit pop up automatically. But if you have the wilder version of brother, you can check it into your browser, and it will work perfectly. So let's just right for you. I'm just closed this speech. And if the own unload will separate into your browser, I pop up will shore before you want to live this speech. So just click on the close button over hair and as I mentioned before, is does not support it into our browser. But you can still try it into your project. Are you can still try it into a browser and let me know it is working for you or not. This is on unload Ease a javascript in build, even handler, that will fire up a JavaScript court when the user will try to close the browser or when the user will leave your witness. So in this way you can create this on on Lord JavaScript, Event handler in tow. You're Charles script core on. Use it as you want 30. Javascript "Join" Method: All right. So now we know all people, even handlers in JavaScript. So in this video, we're gonna be learned some interesting, which is called Join. So let me just go to my project folder. Andi, copy and paste this file over here and create a walkable file called this Human Joe Coleman . Just remember this tree Next. Hi, friend. Join and right Click on this file and open it in. No pack plus plus. So, first off, all I'm just removed this even handler into this body on as well as removed this link from here. No Indo us Crypt AG. We read in our joint courts. So what is joined? Join is actually a job script in visual function ritual. Convert our area into a string. So let's see how we can create a joint on how to use it. So, first of all, let's just create a variable next, then given equal sign. Then let's just make a very real call names. All right, which will look more logical. So now we have our area. It is very evil. So new at a your caps, then into the French asses. This is give some names like John then keep some Ana, then given name Rick. And after this, give a semicolon. No, we have to open and other video girl regional a joint that's their medieval X, then given equal sign. And then we have toe return our first variable name, which will we convert into Aris? So in that case, religion here names, then we need to type a dot. Then we have to type join. Then we have toe open or scientists bracket. And I thought that we have to return a semi colon now, As you can see here, we could not pass any perimeters in this joint. Let me just tell you why we could not pass any parameters in here in couple of minutes. So first of all, let's just print out this eggs available indoor browser and let's see what's happening. So let's just type document door right, and into this document dot right? We just crossing our xperia bill now save the file and go to our project cooler and double click on this fight. Open this up in the browser and let's see how it looks like now, as you can see here, it just print out our Eddie's as a string, as we can mention before it just print out. Our at is as a string, but it will print out our areas index with separated by a comma. This is vital Fall joint will print out at his index into the browser. But if if you want to separate it, this area's index with a hyphen. So how we can do that In this joint fantasies, we just give a double condition, and into this quotation, we just type are parameters. So in this case, we just type a hyphen, then save the file and go to our browser on reload the page. Now, as you can see here, you just passing the hyphen instead off this calmer, so by default, jointly supported at his index by comma. But if you want to change those commas toe whatever you want, like ah, hyphen or a systemic alone or whatever you want you just passing those parameters in this joint Francis's bracket and save the choir, and it will just display into the brother now, as you can see here. So in this way you can use this joint in JavaScript to convert any Cherries into a dynamic stream 31. Javascript "Pop" Method: All right. So indoor previous video will learn about the join mate Orange L A script. And in this video, we're gonna be learn about the pot metal in trouble strip. So first of all, on Goto our poor yet Fuller and create a walkable copy for these German document. Just copy and pasted. Andi rename this to in its hyphen instead on wreck. Click on this file and open it in Northwest Closeness. So what is a port Meter? Hope Meadows? Actually, JavaScript will pop up or removed some index into the attic. So let's try apartment or here, and let's see how it looked like and how it work. So first awful. I'm just removed this joint over here because we don't need any join. So first of all, let's just sprint out a name into a browser from this area. So let's say we want to print out Ah, Rick into our browser. So first we have to just died the variable name, which is names, and then we have to type our index number within this square bracket. So in this case, the in this number for Rick is zeal, one true. So we type two here, and it will print out the Rick in our browser, as we all know that. So first of all is this ticket into our brother Goto our project polar and double click on this Wild. Open this up in the browser, and now, as you can see her, it print out the Rick naming Tor browser. All right, so now go back to our text editor and let's just try the hope method. So first of all, if you want to type apartment hard, you want to type the really real name cause, so names. Then you have toe type a dot. Then you have to add the pop metal so B o. P for populist or and then you open your friend is his record, and after that we have to add a semi colon. Then let's just go ahead and friend the same name from the browser and let's see how it look like just praised the same document, that right, which will trigger the Rick value from this area. And let's see how it looks like so and one more thing we have to add a line break after this horse document that right so it will print out a Sligon Value indoor next line. Just add our line break and save the file and goto our browser on Reload the page. Now, as you can see here, does not bring the value wreaking door browser. It just bring undefined, undefined means Oscar. It will find nothing so it will print out Are Undefined Ward indoor browser on Let's Go Back to our text editor on Let's See the We just print out the same value theme index name , Which is we just spring doubt previously any it will print out the rig name, but why? It will not print out the same value after this pope myth or because this pope method will remove the last index number for my Harry. So it will just remove the rig value into the area for just dead the mosque. It will not find this rig value, and it just brings out on defining our browser. And let me just give you another example. If we can copy and paste the same part. Midhar After this document, daughter right, and we just cleaned out that one index number which will identify as Anna like zero one, so it will the Ener, so it will print out the an indoor browser on Let's see. Is it a little print or the an indoor Rosa or not? Now let's add some. Be a tag after this in this number, so it will print out the value in the next line. Also, let's Annabi attack in hair as well, so save the file and good over Project folder and double click on this vile and open this up in the browser. And let's see how it looks like now, as you can see here. First of all, we have the Rick name, which will print out normally. Then we had the bottom it hard, and it will prop up the Rick name from the area so it will undefined into our browser. Then we had another pop metal, and it will remove another very from this area. So Anna also be undefined. And if you can change this in next name, 200 will be the Joan. So 01 to 0 will be that John. So if I said the file and go to our browser and reload the pit now, as you can see here, we can only have one value into our at if, which is John and John will print out in our browser. So in this way, you can use this pope met Haar. Bach. Matori is actually doing it. Just removed the last value from the Ari. So you can use this pop myth hard in JavaScript. And if you want to remove the last value from the Eyrie, it will the easiest process to do that. 32. Javascript "Reverse" Method: Alright, guys. So now we know Join and hope and a myth. Hordes on. Now in this video, we're gonna be learn about a new era May thought Call reverse. So let's just go ahead. Indoor project holder and creditor. Walkable. Copy for this. A steamer Taco Menge, Where is the John now? Copy and pasted over hair and renamed it to index hyphen. He was on record on this file on Open it in notepad plus plus. No, First of all, this is removed his document. Right. Come here because we don't need it in here on if you want to create a reverse, Harry met her as the name of sounding light. It's airy metal, so you obviously need a airy. So in that case, we already have an area into one names Really evil. So let's just try our divorce Smith or what re forced me, authorities. John, is it just reverse that is indexed by loves to first? That means if I want to try a divorce, Midhar than Rick will Our index numbers video than Anna will want them. John will chew. So let's just try this, reversing it hard and show you guys how to create is reverse, met hard and how to use it. So, first of all, let's just try the real evil name, which is name Andi. Then Daut has, like the previous at his mentor on. Then we want to type reverse. Then you have to type your friends decade and after that, give us a semi colon and that's it. So let's just try one index number from this area into our browser on. Let's see how the reverse will work. So let's just right document dot right then into your friend of these. Then after that, give up semicolon and into the front of this business type. You're very well name names. Then you have to open your square record and into the square record lizards. Type that in next number from the area, so let's just try with zero. So, first of all, look at this. If why, I want to print out zero so it will print out that Sean. But as I mentioned before, reversing a method will refers the arraigned next by last to first. So now the zero will be the reek, so it will print out Reagan Door Brothers Eliza Stride indoor Broza. Just save the file and go to our project. Fuller on. Don't go on this wild. Open this up in the browser and let's see how it looked like. Now, as you can see here, it print out the Rick Indoor browser. And if I go to my text editor on try to two years, probably that Joan, because reversed anime Third will regards the areas index numbers. So 1st 1 is John now the last one. So let's astride also into our brothers if the file and got over browser and reload the page. Now, as you can see, her join in this number is now too. So in this way, you can use this reverse mint heart to reversed any other index number. 33. Javascript "Push" Method: Alright, guys. So indoor previous video We learn about the reverse methought on in the video. We're gonna be learn about another myth or called Booth. So let me just go to my project folder on create a workable copy for the best email. Just copy and pasted over here and rename it to in next hyphen boost. No. Right. Click on this file and open it in no back plus plus. No. What is the post metal? The postman hard will pose some values into your existing Harry. So let me just try that push. Met hard and give you a brief explanation. So just remove this reverse from hair. Now we have our names variable whichever areas in it. Now, let me just try the post method and pushed some to men's into this existing area. So first off, all you have to type your variable name names, then died dot Then you have to type bush, then open your fantasies. And after that, give us cynical and into this fantasies, we have to pass our parameters that we want. Toe puts it into this existing Eric. So let's say we aren't took post a name. Call George George on also, we under post another name Call. Let's see, Dave. All right, so we want this to names into this existing areas. So we use the post method. What this post, Mr does, is it just pulls this two names this to at is value into this existing area. So in that case, the end is in this Numbers would be looked like this 01 to three four because post Met hard will post the new value into your existing very after the last index. So after the reek, that just will coming. And after the jaws that Dave will come in. So in that case, the areas in the number should be like this. 012 34 So let me just try a document. Not right. They were here talking in dog, right? When a friend of then after that, he was gonna into this went to this visit style names on open your square bracket and into the square bracket. Let just type the index number called four, which will print out that Dave into our browser. So let me just try it into our browsers. Said the file goto the project folder and double click on this filed. Open this up in the browser and let's see how it looked like. Now, as you can see here, it can print out that Dave Indoor browser on If you want to try hair three instead of this four in next number, it will point out that chose indoor Broza. So let me just try it as well in your brother listens. Reload the page. Now, as you can see here, it just window jaws into your browser. So in this way you can use this post myth heart and who's a single value or a multiple value into your existing Harry. And it will be very helpful when you have to try thousands of lines. Of course, after the area now you don't want to find the area toe, put some more value into it. You just want to write a single line. You just want to use this whose method? Toe whose new development your existing any. So in this way you can create this post made hard and use it in JavaScript 34. Javascript "Short" Method: All right, guys. Eso Now, In our previous video, we learned about a postman heart. And in this video, we're gonna be learn about the last Adam it hard call short. So let me just go to my project folder on and create a walkable copy for this estimable document. Just copy and pasted over here on Renamed it to index hyphen. Short on directly on this file and open it in Northwest Crustless. So what is the short mated? Short mid hard is shorten. This area is value by their alphabetical numbers. So let me just try the short metal for you and show you guys how this will work in javascript. So let me just remove this Portsmouth out from here because we don't need it. Andi, after this. Very well. We want to type the variable name first names. Then we have to die the dot. Then we have to type shock on. After that, we have to open our friend disease. And after that, we have to keep the semicolon. Andi, that's it. So, Liz, print out this It is in this as a shrink as a teacher is in the previous video, we'll need to add the joint mitt Hard toe, print out This that is indexed as a stream into your browser. So let me just open another variable hair. Who are X X is real name, then given equal signed and type no video names. Then when do I dot then went to tape join Then the front is is And after that, give us Temuco. Then we want to document that, right? That ex very well document dot Right on. And here we want to print out the X variable which will print out this. It is in this as a string on. Also, there's gonna be shortened using their alphabetical number because we are using the short at a Met her here. So let me just try it into your browser, save the file and goto our project folder and only on this pilot. Open this up in the browser and let's see how it looked like now, as you can see here. First of all, let's go to our text religion on, See the area values over here. First of all, we have the John. Then we have the Anna. Then we have the Rick. But we just tried a short metal short mitt Hard will short in this area is value into their alphabetical number. So let me just go to our browser and let's see how it will print out. Now, as you can see here, it will print out and our first because E is the very first alphabetical numbers. So it will print out and our first, then that joined in the rig so it will short in this area is value as ultra critical order . So you can use this short Midhar too short and you at his value by their own political numbers.