 Welcome back everyone. Let's start this video with the basic concepts of JavaScript. JavaScript is a programming language which is used to design webpages using html. It is very lightweight and it allows scripts written on client machine to interact with the user. A program written in JavaScript can access the elements of a web page and the browser window in which it is running and perform actions on those elements as well as create new page elements. Before starting programming with JavaScript, we must understand why we should learn JavaScript language. JavaScript language is the most popular programming language in the world. Once you learn JavaScript, it helps you developing a great frontend and backend software. It helps you create really beautiful and dynamic websites. Due to high demand, there is tons of job opportunities and growth due to JavaScript. JavaScript contains tons of frameworks, libraries already developed which you can use easily for the development of your software. After learning JavaScript, you will be able to perform these tasks. The first important one is client-side validation. Nowadays, it is important to verify any user input before submitting it to the server and JavaScript plays very important role in validating those inputs at frontend itself. Then it is helpful for manipulating HTML pages. It gives user notification in the form of pop-ups. The backend data can be loaded using the libraries like azaks. JavaScript can be used to build presentations, banners, slideshows on your web pages. The features of JavaScript language are it is dynamically modify HTML page, it reacts to user input, it validates user input, it can create cookies and it is open and cross-platform language. So let's begin with the basics of JavaScript. The first basic element of JavaScript is a document object model. This document object model or commonly known as DOM is a conceptual way of visualizing a document and its content. Each time your browser is asked to load and display a page, it needs to interpret source code contained in HTML file. As a part of this parsing process, the browser creates a type of internal model known as DOM. It is provided in the tree-like structure in which the document is the root object of all the other objects and then it contains various objects like HTML, head, body, title and so on. It is the model that the browser refers to when rendering a visible page. You can use JavaScript to access and edit various parts of DOM representation at the same time changing the way the user sees and interacts with the page in view. Now let's move further. While writing the JavaScript code in your web page, there are two ways of including the JavaScript. First one is to include the JavaScript directly into the HTML file. The code for that is you have to write a tag script in your HTML file. Either you can mention it in the head tag or you can directly write it in the body tag. Anywhere is supported. So in between the tag, opening and closing script tag, all the statements of JavaScript will be written. The second way and usually the preferable way to include your code is to save your JavaScript into separate file and then use that file as a source in your HTML file. For that purpose, you will create a file with the extension .js and you will pass that file as a source to your script tag in HTML file. In both ways, you can write a JavaScript in your web page and run the JavaScript pages efficiently. The only question while writing the JavaScript external file is that whenever you are creating external file for writing the JavaScript, do not include the script tag in that file. Just write the script that you want to include and then save it using .js extension and call it in the HTML file. Next part covers the values used in JavaScript. The values are represented in two forms. One is known as literals and or we can call it as constants and the other one is variables. So let's see all the types one by one. JavaScript literals are nothing but the constant that we directly use in our programs like the value of Pi or any other constant value that you can directly use. And the variables in JavaScript are declared using the optional keyword where here like any unlike any other language, you do not need to use any keyword like integer, character, string to declare a variable of any type. Whatever variable you want to declare just use the keyword where that is sufficient for declaring either a string variable, character variable or integer variable. Only the thing is that the JavaScript is case sensitive language so we have to keep this in mind while declaring the variables. Here the simple example of declaring a variable is given where we are declaring a variable name using the keyword where and it is a string. So that's my is equal to double quotes. We are writing the string. So in this way we can declare the variables in JavaScript. Here we can see the integer value is declared as where the price is equal to 90 for character. It is declared as where product name is equal to double quotes in the other valid. So overall you can say that JavaScript variable declaration is very easy compared to all other programming languages in which you can declare the variables by simply using a keyword where. You just have to remember in mind while writing the variables that you have to choose the readable and meaningful variable name every time you declare a variable. Now let's start with the operators available with JavaScript. JavaScript is having a variety of operators like any other programming language. The first set of operators is arithmetic operators perform all the basic arithmetic operations like addition, subtraction, multiplication, division and so on. Then it has assignment operators which is used to assign the values to a variable. It has equal to plus equal to minus equal to multiply equal to and so on. Then JavaScript is having some string operators which we can use for concatenation of strings directly without using any function. So it is having a plus operator which will operate as a concatenation of two strings. If you want to concatenate a string then insert the plus sign in between the two, both the strings. Then the another string operator is plus equal to which is used to assign a value to that string. Next are comparison operators which is having equal to operator not equal to less than, greater than, less than equal to, greater than equal to. Then there are logical operators logical and or and not. Bitwise operators and or not, shift, left shift, right shift, etc. And JavaScript is having some special operators which you can use in your programs. The first one is conditional operator then it has comma operator. You can delete anything using the delete operator. It has instance of operator. You can create the objects using new operator. To check the type of object you have type of operator, void and yet. Now let's see some of the operators in program form. So we will first see the simple operator that is arithmetic operator. In this program we have taken two variables, variable a and b with the values 20 and 10. Now let us perform the arithmetic operations on these values. We are directly calling the output here. So I am writing document of write a plus b. This statement will help us give a break in the line while displaying the output. So this br tag is helpful to display the output on the next line. So in this fashion we will perform addition, subtraction, multiplication and division. Let's check the output. So let's run the program and this is the output of the program. Addition, subtraction, multiplication and division. The next example is comparison operator. Here again two variables are there a is equal to 20, b is equal to 10. We are performing these operations a is equal to b, a less than b, a greater than b and a not equal to b. The result of this operation will be a Boolean value either true or false depending on the output. That means while checking a is equal to b if the value of a and b matches then it will return true otherwise it will return false. And similarly for all the other operations. Now let's check the output of this program. So this is the output of this program. And it totally depends on the result of these two variables. Now let's see the conditional operators. Here we have taken two variables, variable a and b declared to 10 and 20. Now we have to perform some condition. So conditional operators are helpful whenever we do not want to use the if statements. So when variable is taken res in that we are checking whether a is greater than b. So if a is greater than b then the answer will be displayed as a. So a is taken as the first parameter and then b is taken as second parameter. In the second set the output checking is a less than b. If it is true then a will be displayed otherwise b will be displayed. So let's check the output. So in the first set a is greater than b is not true. So that's why the answer is displayed as 20. That means it has taken the second part. In the next set a is less than b is true. That's why it has taken 10 as an answer. So in this way you can perform the operations using various operators available in JavaScript. JavaScript provides three very efficient pop-up boxes that we can use for variety of purposes. The three boxes are alert box confirm and prompt. So let's see what are the uses of these pop-up boxes. The first one is the alert box. It is basically used if you want to make sure information comes through the user. And it is also used to display the messages on web browser. When an alert box pops up the user will have to click OK to proceed. The syntax to call the alert box is window.alert. Then the next is the confirm box. It is used if you want the user to verify or accept something. The confirm box will have two options OK or cancer. Depending on the output the user will decide either he have to click on OK or cancer. The syntax for calling the confirm box is window.confirm and in bracket the text he wants to display on the confirm box. The third box is known as prompt box which is often used if the user wants to accept the input at the runtime on a web browser. When a prompt box appears on web browser the user will have to click either OK or cancer to proceed after entering an input value. The syntax of using the prompt box is window.confirm Then you will mention the text and end with a semicolon. So let's see all these three boxes when available. The first one is very simple, alert box. Here we are just printing a single message that I am an alert box. So when we will run this program this message will be displayed on web browser as a pop-up box. Let's check the output. So as soon as you run the program the pop-up box appears and this is known as alert box which is having the message and a single button OK. If you click on the button this message will disappear. So like that. The second box is confirm box which is having a simple use of confirming anything while processing further for any operation. So here we will write confirm and the message that you want to print on that confirm box. Now let's check the output. So this is the confirm box. Here the message is given and two buttons are there OK and cancer. Whatever your decision will be you will click on the button according to that. The last one is the prompt pop-up which is used to accept the input. So here we are using prompt. In bracket we are asking the user to enter the name. Whenever this prompt box will appear on the screen it will have the structure. Here is your message. Here is the text box attached in the prompt box which will be used to accept the input and there is a button OK and cancel that you will be clicking after typing something in the text box. So if you want to accept and display the name using the prompt box you can add it here. Save the result of the prompt box in some variable. The variable A is equal to prompt enter your name. After that whatever name will be accepted by the prompt box is written in the variable. So let's check whether this program will work or not. Type name and click on OK button. So it is displaying the name accepted by the prompt on your wave function. So like that all these functions or pop-up boxes can be used for your benefit. Conditional statements in JavaScript are used to check the conditions at appropriate times. There are three different types of conditional statements if, if else and if else later. So let's see all these statements one by one. The first is if statement. The syntax of if statement is the statement. In bracket we can write the condition that we want to check and in curly bracket the result of this condition will be displayed. The second statement is if else statement in that first part is having the true part of the condition. That means if you are giving some condition then the first part in the first bracket will execute if the condition is true and if the condition is false then the second part of that expression will be evaluated. The third conditional statement is else if ladder in which we can check series of if conditions by using the ladder. So here the syntax is first if condition the first part will be evaluated. Then comes else if second expression or second condition the second part will be evaluated and so on. So let's see all these one by one. So this is the first example of if statement. It is simple plain if statement. Here one variable is taken variable a is equal to 20 condition is if a is greater than 10. If this part is true then the statement written in this bracket will be executed. The statement written is document dot write and the message will be displayed on the screen that the value of a is greater than 10. And the script is ended. So let's check whether it is displaying the output or not. So the output is displayed as value of a is greater than 10. Now the next is program of if else. Here now we have declared one variable a is equal to 20. The condition we are checking is if the number that we have accepted is even or odd. For that purpose we are writing the condition in if statement as a mod 2 double equals to 0. If the answer is true that means the number is even then the first statement will be executed as a is even number. Otherwise the second statement will be executed as a is odd number. So let's check the output of this program. So we have accepted the value a is equal to 20 which is even number so the result is a is even number. Let's check the program for else if ladder. Here we have taken the variable a is equal to 20. Now we are checking first condition if a is equal to 10. If it will be true the first statement will be executed. Else the second condition is a is equal to 15. And then third condition is if a is equal to 20. And if none of the conditions are true then the last part of the statement will be executed as a is not equal to 10, 15 or 20. Now let's check the output of this program. Here we will run this program and the answer is a is equal to 20. As we have seen in this program the variable a is declared as 20. That's why the third statement is executed which says that a is equal to 20. So this is all about the conditional statements which we can use in JavaScript. There are three different types of looping statements in JavaScript for loop, while loop and do while loop. The syntax for for loop is here we are writing the loop initialization is the first part then we will write the condition. And then increment or decrement operator will be there. In the curly bracket the code which we want to execute after all these conditions will be executed. The syntax for while loop is very simple while in bracket condition and depending on the condition the code will be executed. The third statement is the do while statement in which first the code that is to be executed is written after the code the while statement is given and then the condition will be executed. So let's see all these three one by one. This is the program for for loop. Here we are going to print simple values of i from 1 to 5. For that purpose I have used for loop. Here we have taken i is equal to 1, i less than equal to 5 and i plus plus. In bracket we are writing document outright and we are printing i. So let's check the program. So the simple output of for loop will be displayed. If you want to change this program and add some condition then you can add it in the for loop as if you want to check the even numbers from 1 to 5 then the condition will be if i mod 2 is equal to 0. Then in that now it will print only even numbers between 1 to 5. Now let's check whether our input is correct or not. So from 1 to 5 only two even numbers are printed that is 2 and 4. Now let's check the statement for while. Here we are taking one variable i is equal to 11. In while the initialization is done at the beginning of the loop then the loop is written then in that condition is written while i is less than equal to 15. So that means the initialization is started at 11 and it will end up to 15 and then these values will be printed using document.correct. Let's check the output. So the values from 11 to 15 are printed on your web browser. Similarly the do while loop will have the coding initialization then do then statement is written increment is there and then the condition is given. So the difference between while and do while loop is that in while statement first the condition is checked and depending on the condition the output is displayed. While in do while loop first at least once the statement is executed and then the condition is checked. If the condition is true then the statement will continue executing or it will stop the execution. So these are the looping statements in JavaScript which we can use in any program. The next conditional statement in JavaScript is switched statement. In JavaScript the use of switch statement is to handle multiple executions in a single program. Wherever you want to execute multiple statements depending on various cases then you can use switch. The syntax of switch is very simple. You write the expression in switch then write down the values that you want to evaluate. There may be multiple value single value depending on your condition. If none of the values are true then the default condition will be executed in the switch statement. The next statement which we can use in JavaScript is break statement which is generally used to jump out of the loop. Here in this example you can see we have used simple for statement for variable i which is incrementing from 0 to 10. The statement written as if i is equal to 3 break and then we are printing i. The result of this statement will be simply the value of i printing on the screen from 0 to 3 as we have break the loop at the third position. The next statement is continue statement. The continue statement will break the execution at the saved point and then again continue on the next iteration. That means if we are taking the value of i from 0 to 10 and we are mentioning in if condition i is equal to 3 then while printing i the continue statement will go on 0, 1, 2. It will skip 3 and directly go on 4. This is the use of continue statement. Now let's check all these three statements by using programs. First we will see switch statement. The simple example is taken. Here we are checking the grade of a student. So the variable taken here is grade and it is defined to be. Then the next variable is result which will show the result of the switch case statements. In switch statement we are executing the condition depending on the grade. So we are taking parameter grade for the switch statement. Now the first statement is written as a so the result is equal to a grade and the case will break. Here the break statement will break the execution of this case and it will come out of the switch statement. Similarly there are three cases written for a, b and c which will print either a grade, b grade, c grade and if none of the result is true it will execute the default statement which is no grade. And finally after the execution it will print the result. So let's check the result of the switch statement. Let's run it in the browser. This is our program and the answer is b grade. As we have taken or initialized the variable b to grade to b that's where the result is b. Now let's see the example of break statement. The example is same. Here variable i is initialized from 0 to 10. If i is equal to 3 the loop will break and then i will be printed on screen. Now as per the logic of break it will print up to 0 to 2 and then it will close the operation. Now let's check the output if it is true or not. So you can see here the break statement is executed from 0, 1, 2 and whenever the statement occurs i is equal to 3 then it will automatically break out of that loop. The third statement is continue statement in which we are taking the variable i which will go from 0 to 10. Condition is if i is equal to 3 then continue. What happens here is that it will start printing the values of i from 0 to 10. Whenever the value will reach to 3 it will skip this value and will continue printing from 4. So let's check how the output will be there for continue statement. See here the execution of i will skip the state 3 and it will print the remaining result on the screen. So in this way you can use all these statements in JavaScript easily by writing simple statements and using them in your larger quotes. Thank you. The first built-in object in Java is array. An array is a spatial variable which can hold more than one values at a time. In JavaScript there are three ways to construct the array. First one is by using the array literal. Second by creating the instance of array directly using the new keyword or by using an array constructor using new keyword. The first one is having the syntax variable name of the array and in square bracket mention the values that you want to add in the array. The second one with the new keyword has the syntax variable array name is equal to new and the name of class is given array. And the third one is having the syntax. Here again the array is created using new operator and then we can add the elements like simple constructor in the array. In JavaScript the array class has various methods that you can perform on array for various purposes. Let us overlook the methods one by one. The first method is concat. Here you can perform the concatenation of various arrays in a single array. Then you can also copy one array into another using the copy within method. If you want to insert the elements into existing array then you can use the fill method in array. The includes method check whether the given array contains the specified element. If you want to find the index of specific element that means the position of specific element then you can use the index of method. Whenever you want to join two elements in the array then you can use join method. The last index of method searches for the specified element in the given array which is at the last position and it returns the match of that string. The push operation is basically performed in order to insert the elements into the array. Whenever you will perform the push operation the elements of the array will be added at the end of the array. Similarly the pop operation will remove the array elements from the last element of that array. The reverse method is simply used to reverse the array in any position. Sort method is used to sort the array. Shift method removes the first element of the given array and returns that element as a result. So let's check all these things one by one. First we will see how to declare a simple array and display it on your web browser. The script is having the array named cars. In this cars array we have taken three variables. Now whenever we want to take the string components in the array then declare them as double quotes and separate them using comma. If you want to use numeric values then directly use the values instead of using the double quotes. In bracket you can directly print the values of cars using document.write and then you can display them on the web browser. Now let's check whether it is displaying all the array elements or not. See. Here we can see all the three elements that we have created in the array on your web browser. The next program is how to sort the array elements. Now in JavaScript you do not have to write any extra code for looping and statements and conditions for sorting the elements of the array. Simply declare the array that you want to sort. Here in this example we have taken four elements in the array fruits banana, orange, apple and mango. First we are printing the array in an order in which it is created. After that you are just calling the sort method on the array simply writing fruits.sort. And then we are printing the array in a sorted order. By using this simple statement you can directly sort the array in any order. You do not need to use the looping and conditional statements for this sorting. Let's check the result. So the original order is banana, orange, apple and mango. After sorting the arrangement becomes apple, banana, mango and orange. So this is the sorting operation on array. Now we will see another two operations when it is pushed. Here again if you want to insert the element in the array then you can use push method. If you want to use push method it will insert the element at the end of the array. If you want to insert the element at particular position then you can use the fill method to fill the array on any location. So here simply write down fruits.push in bracket. Whatever element you want to insert in fruits can be given in the bracket and then print your result. So let's check what is the result of push operation. So here you can see your original array is banana, orange, apple and mango. We have passed kiwi as a parameter to the push operation. So the array becomes banana, orange, apple, mango and kiwi. Now similarly you will see the operation pop. So pop operation is basically used to delete the last element of array. So here your original array is banana, orange, apple and mango. So print that array. After that call pop method on your array fruits.pop and then again print the array. So you will see the difference in the result. Let's check it. So the original array is banana, orange, apple and mango. Now we are performing the pop operation. Pop operation will remove the last element of array. So the result is banana, orange and apple. So in this way we can easily declare the array and perform various operations on array as per our need. The second built-in object in JavaScript is string. By using string in JavaScript you can perform variety of operations on the strings. So let's see how to declare the string and how to perform various operations on string. There are two ways of declaring or creating a string in JavaScript. First one by using a string real literal and by using string object. By using string literal we have the syntax variable string name is equal to value of that string given in double quotes. If we are declaring the string by using the object then we can create it using the new keyword like where string name is equal to new string and then in bracket double quotes will have the string that you want to operate in. There are variety of methods that you can perform on the string. So let's start with all the methods. First one is the concat. It provides the combination of two or more strings. So if you want to combine two strings then you can use concat function. The second one is carrot method which is useful to find out the character and the location at which the character is present. For that purpose you have to return the index of the character and depending on the index it will return the character. The third method is carrot code at method. This method is provided in JavaScript specially to determine or to find the unicode of any given character. So if you want to find the unicode of any character then use carrot code at method. It is similar to carrot method only you will write carrot code at and in bracket index. Whatever index you have mentioned you will be seen the unicode of that particular character on your web browser. The next method is the index of method which is used to search the position of particular character or string in a sequence of even values. Now this method is case sensitive which is to be remain which we have to keep in mind while writing the program. It has variety of versions of writing this code. First one is index of in bracket ch that means you can pass the character to the index of method. Then you can pass the combination of character and index position from which you want to start the searching. Whenever the first option will be given the searching will start from 0th location. Whenever the second option will be given the searching of the character will start from the first occurrence of that element. Similarly you can do it for the whole string as you can pass either a string or you can pass the combination of string and index. So you can play in various roles in using index of operation. The next method is last index of which is useful to search the position of a particular character or string. So now what is the difference between last index of and index of method? The difference is that the index of method started the searching from the beginning of the character while the last index of method started the searching from the ending of the character. That means the end sequence of that character. There are again all the four versions available like index of method for last index of also. We will see that in the program so you will get your doubts clear. The next method is search method which is a simple search method that you can perform to search a regular expression in a string in the given string. If any match is not found in your given string then this method returns minus one as a result. Now let's see all these programs one by one to understand these methods. First the carrot method very simple. Here in the variable str we have given the string as welcome and now I am finding the character at the fourth position. So I am writing it as str.carat4 so it will return the character of four position. So let's see how it works. So the character at four position is O in the welcome string so it has displayed O on the screen. Now let's move towards the next code that is caracordat. Now the caracordat method will return the unicode of the character given by this index position. In the index position given is four so let's check the unicode of the fourth character. The fourth character is O so the unicode of O is one one one which is universally defined. This method just returns the code which is already stored in the database. Now next is concat. If you want to concat two different things then here the variable X is having one string hello. And variable Y is having another string everyone. In this statement we are concatting X and Y with each other like X dot concat Y. So Y will be concatenated with X. Let's check the result. Run the concat file. So there are two strings hello and everyone and now after concatenation the string becomes hello everywhere. The next program is for checking the index of method. Now here you will better understand the difference between index of and last index of method. The program is similar. You have one string welcome to JavaScript and now you are finding the index of A. So you are finding the cost occurrence of A in the given string. So let's check what is the output of this program. Run it. So it shows where. Why it is showing 12? Because whenever you will count the number of places from W, A comes at 12th position first time. It also counts the spaces given in between the strings. So if you start counting this as one and up to this A the first A it will have 12 values. So that's why the output is 12. Similarly check last index of method. The program is very same only here instead of index of write last index of method. Where whenever you are writing the last index of method. Now you will write it as last in small acres and then the index of method will have the I capital and O capital. Keep it in mind as it is a sensitive. So let's see the output of this statement. So now here in this string it will find the occurrence of A from the ending of the string. So let's check what will be the value last index of run it. That is 14. Why it is 14? Because if you count whole string then this is the last occurrence of A which is on the 14th location. So it will return 14 as a result. And now we have a search method. How we can perform the search method is given here. We have a long string here JavaScript is a scripting language scripting languages are often interpreted. This string is taken long by purpose so that we will be able to search any particular thing easily. Now I have to search one string in my string. So I will write it as str.search and in bracket whatever character or whatever string I have to search from this given string will write here. So I want to search a word scripting so I will write it here. Let's see the output so it will show the occurrence of search. So in this way all these methods are working. In the next tutorial we will see another methods of string class. Till then practice them and make your logic perfect. Thank you. Let us see another set of string functions. The first one is match function. This match method is used to match the string against a regular expression. The syntax is very simple. Here you will write the match and in bracket you can give the regular expression or you can mention the string that you want to compare with your original string. Then there is a method replace which is used to replace a part of a given string with a new substring. In this you have to write the replace in bracket. You will mention your original string and then new string that you want to replace in that original string. The third method is substring method which is used to fetch the part of the given string and return a new string. The syntax for this substring method is substring and you have to mention the starting point and length of the substring that you want to extract from original string. The next method is substring method. So substring method is used to fetch the string on the basis of provided index and returns a new substring. Now you have to understand the difference between substring method and substr method. Here in this substr method you are giving the parameter as starting position and length. So if your starting position is at second position of the string then in the start parameter you will write 2 and if you want to check or fetch the substring up to sixth character of your string then you will mention as 2,6. Opposite to that if you are using substring method then it will have the starting position and ending position of the string and directly in between that the substring will be fetched in another string. Then the next method is slice method which is given in JavaScript. This method is also used to fetch the part of the string and returns a new string. The slice method is having two parameters start and end. Whatever part you want to slice out from your original string you will mention as start and end and then that part will be extracted from your original string. Then the next two very simple methods are converting the string into uppercase or lowercase. So firstly if you want to convert the string in lowercase call two lowercase method on your original string and if you want to convert your string in uppercase then call two uppercase method on your original string. Now let's see all the programs one by one. So here our first program is to check whether we are matching our original string with the given string in the parameter. So the original string is JavaScript and in the result you are calling original string str.match in bracket whatever string you want to match with your original string mention it in double quotes. So the statement is str.match in bracket Java. So your original script string will be searched for this parameter Java and if the match is found then it will return the result. So let's check the output. So the keyword is available in your original string so it has written this Java keyword on your web browser. The next method is replace method. Here you can use the replace method to replace any part of your original string with another string. So the original string is Java language and you have to replace that original string with the new string. So write it str.replace in bracket the first parameter is the part of the string that you want to replace and after comma the second part of parameter is the string that you want to replace in your original string. So let's check the output. So the original string is Java language you are replacing language with script so the output should be JavaScript. In the programming browser and now the output is JavaScript. So the original script is changed from Java language to JavaScript. Let's check another program. We'll check sub str method which is also simple method. Your original string is JavaScript. You want to extract a substring from your original string then you will write str.substr. Now mention the starting position. I am mentioning the starting position 0 so it will start from the 0th location of the string and the length is 5. So it will start the fetching process from 0 location and it will end up to fifth character as we have given the length as 5. Let's check the output. So it has started at the 0 position which is J and after that 5 characters are fetched out from your original string. So the new string becomes Java S. Let's check another one example of slice method. Now here in slice method your original string is welcome. And you are mentioning the starting and ending position in the slice method to extract that particular characters from your string. So I am mentioning the starting position as 2 and ending position as 5. Let's see what will be the output of the slice. So the original string was welcome. It has started from L and ended on O. So the string extracted from the original string is LCO. Now we will see one of the example of lowercase and uppercase. Let's see the example of uppercase. The original string is presented in lowercase. If you want to convert it in uppercase then write it str.toLowercase or toUppercase. So it will convert the string in lowercase or uppercase. So here you have to just change to lowercase or to uppercase depending on your condition. So let's check. Here the string was given in uppercase. We have called to lowercase method. It is converted into lowercase. So in this way you can use any of the string method in your program to perform various operations on your existing data. The next built-in object in JavaScript is math. The math class or math object is used to perform variety of mathematical operations on your data. So to understand this math object we will see a program. Here in this program we have written a script where three variables are declared. Variable A is having value 9, variable B is having value 2 and the third variable is declared as 200. Now we will perform various mathematical operations on this variable. So using math object you can perform the first operation as to find a power of any variable. To find the power of a variable just write math.function which is POW in bracket the variables that you want to use for finding the power. The first variable is the base variable and the second one will be the power of that first variable. So here the output will be A raise to B. The next mathematical function is to find the square root of a given number. For that purpose the function is sqrt. Just write math.sqrt and in bracket the variable for which you have to find the square root. Similarly you can perform the sine function, cos function to find the sine and cos values of a variable. Then you can find the minimum of two numbers, maximum between the two numbers and you can also get a random value of your function. To find the minimum you have to pass two parameters A and B where you will be finding the minimum number between A and B. Similarly for max you have to pass two parameters and the result will be the maximum number between A and B. So in this program we have used the x variable for sine and cos as we have to find the sine value and cos value of that variable. So we have taken a larger number for that and for other functions we are using A and B as a variable. So let's check the output of this program. So this will be the output of the program. The first one is the output of power. The second one is the output of square root. Third and fourth values are showing the sine and cosine values of a given number. The next is the minimum of two and maximum of the two and then it is generating a random number between zero and one. So in this way you can use this mathematical function in various forms to display or to perform mathematical operations on your data. Now let us see another built-in object that is date object and set interval and set time of methods related to the date object. First we will see the use of date object. The date object in JavaScript is used to display date and time and to perform various operations on the date and time functions. The syntax for date creating a date object is you can create a blank constructor. Then you can create a constructor with the parameter milliseconds. Then you can mention the date string or you can mention the date in the format of year, month and date. Using any one of the constructor you can create a date function and then call it on any object. The set interval method calls a function to evaluate an expression at specified intervals. Generally the interval is given in milliseconds. The syntax to evaluate set interval method is set interval. In bracket the function will be written which we want to evaluate continuously. Then the milliseconds will be mentioned for which the function will evaluate continuously and then other parameters will be included. The set interval method will be active until and unless the clear interval method is called or the window in which the program is running is closed. The next method is set time out method which calls a function or evaluates an expression after a specified number of milliseconds. That means if you use set time out method you have to wait for particular milliseconds and after that the function will evaluate itself. The syntax for set time out method is write a function that you want to evaluate. Then mention the milliseconds for which you have to wait and then other parameters. Now let's see all these methods one by one. So this is the simple example of creating a date object using date class and then displaying the date on your browser. So here we have created the object D and we have created it using new operator. Then we have printed the object D which will display current date and time of your system. After that we have called various methods on this object to display the date and time in different formats. The first method is to local date stream which will display the date in the format given in your local computer. And the second one is the method to local time stream which will display the time of your system. So let's see the output. So here due to first object current date and time is displayed which is having date, date, year, time everything is given in proper format. Due to the second function only the date is displayed in the current format that is month, date and year. And the third function is used to display the time in hours, minutes and seconds format. Now let's move forward. Now the use of set interval method is already discussed. Here we have created a script in which the variable is declared and in that set interval method is called. The parameters of set interval methods are the function that we are going to call and the milliseconds for which we have to call this function. Now let's write the function set well. The setColor function is having a small code to set a background color of your browser. To set a background color of a browser you have a statement in html or javascript as document.body.style.backgroundColor. Or you can write the first part in any variable and then call that variable.style.backgroundColor. In using this you can set any color to your browser. So the setColor function will set the background color either to yellow or pink. So after that the next function is stopColor. Here clear interval method is called until and unless we close that window in which the program is running it will wait for this clear interval method. Or otherwise if the user closes the window then this function will automatically stop. So let's check the output of setInterval method. So the screen is continuously changing the color from yellow to pink, pink to yellow. If you want to stop then we will click on the stop toggling. Whenever we will click on this button the clear interval method will be called. So you have two ways to close this either click on the button or either close the window. So clicking on the button will stop the flickering of colors. Now the next method is setTimeoutMethod. Here one button is created and on the on click event of that button the function is called. In that function simply write a variable equals to setTimeout. Then pass the function for which you have to execute it after that time and mention the time in milliseconds after which you have to display the function. In this alert function only alert is given as hello. So to sum up this program it will simply work as the program will have a button. After that while you will click on that button after clicking the button the browser will wait for three seconds and after three seconds the alert will be displayed on the browser. So let's check the output. So I will click on this button try it. It will wait for three seconds and then the alert message displays. So these are the examples using which you can easily perform various operations. You can use setInterval and setTimeout method for animations creating animations in JavaScript or for your websites easily. The next section highlights the use of functions in JavaScript. Functions are generally used by the user whenever they want to perform a repeated task. The function is having a three step process in which firstly the function is declared then the function is defined in your script and finally the function is called whenever we want to perform a task repeatedly. In JavaScript whenever you want to declare a function just write a code function and then the name of function that you want to create. So let's see the example of creating a simple function here. I'm creating a simple function as display. So the syntax is function name of the function is display in that I'm calling an alert box which will print a statement or any message given by me. So let's type this is a JavaScript function close the function. Now this is known as the definition of function in which we have defined a task that you want to perform. Now whenever we want to repeat this task what we will do is we will call this display function several times. This is called as calling of a function. So if I will have to display this function or call this function I will simply write the name of function and that's it. So write the function as many times as you want to run it on your browser. Save the program select all types and then write function the html. So let's run our program. This is first calling of function second, third and fourth. So here you can count this is the first calling the original written function the second, third and fourth. That's why the function was called for four times. Now let's see how to pass the parameters to the function. Just take a new file and here we have to see how to pass the parameters to a function. Then write one function. Suppose we are going to perform a multiplication on two variables. So the name of function is multiplication. Or simply write down multiply a short name and then the parameter will be given. In JavaScript we do not have to initialize the variable type. That means we do not have to write the integer character string type before the variable. You can directly mention the name of variables. After that now let's perform the multiplication. Change the message. Suppose we are going to print it document dot write then perform the multiplication x into y. Then if you want to go on next line after this output use the break statement. And now remove this. Now call the multiply function various times for variety of data. So first we will have the multiplication for 10 and 20. Then we will have the multiply function for 20 and 5. And you can add it further. Let's save it with all types. Give name number. Here is our file. Then the output is 200 and 100. So first is multiplication of 10 into 20 which is passed as a parameter to this function. Here multiplication is performed and the result is displayed. And the second time the result is 20 into 5 and the result is displayed on the screen. Let's see how to return a value in the function. Let's take another example. Now let's return something from this function. Keep the function as it is. Instead of this statement we will write return. What we have to return? We can return the multiplication of x and y. After that we will call our document.write statement to display the result. Call the function and we can remove this. This index is document.retractive. Now what happens here is that whenever you will call the function with parameter x and y, the return statement will return the multiplication of x and y to the original function. And this original function will multiply this 10 by 20 and it will return the result to document.write. And the result will be displayed on your screen. So let's save the program and check the output. All types with the name return.html. Let's check the program one more time. The script is given function is multiply x into y it will return x into y. And then document.write we have to multiply. Here we have to give the parameter by the help of form of multiplication. Save it. Let's check whether the error is solved or not. Then parameter is missing. The program should definitely run. Yes. The result is 200. So in this way you can use the function for performing various tasks using various aspects of the functions in JavaScript. This section covers another important aspect of JavaScript programming that is event. Events are the actions triggered on the HTML elements when something is happening with the HTML elements. In order to develop dynamic web pages, events play important role for the development of dynamic pages. To understand the creation and maintaining of the events we are going to see a series of programs in this section. So let's start with the first HTML element mouse and handling the events on mouse. For example, we have taken two events for mouse on mouse over and on mouse out. So let's see the program. In the body tag, we have taken the IMG tag which is basically used to insert the image in your HTML code. Here we are calling the first event on mouse over. Equals to whenever you want to trigger some event, we have to give a function as a parameter to that event. So I am giving a parameter as big image to this mouse over effect. Then the next event is on mouse out in which another function is called which is known as normal image. Both this function will have their code in the script tag. Next the border is set to 0. SRC is the source from which we are going to operate on this image tag. Width and height is set to 32.32. Let's see how the script is working. In the script we have two functions big image and normal image. The parameter is passed. Here we are setting the height and width of the image. In big image function, the height and width is increased to 64 pixels. And in normal image function, the height is maintained on 32 pixels as even in the IMG tag. Now let's check how the output of this program is working. Whenever we run the program, we see a normal image of 32 pixels. Let's see if the mouse over effect is working or not. The mouse over effect will start working whenever you will point a mouse to that image. Let's see. So this image is going for 64 pixels. If you take the mouse out from that image, it will go to normal position. Then big, normal, big and normal. In this way, you can perform mouse events on your HTML elements easy. The next set of events is performed on a button. Here are two events are taken, on click event and on subreddit. Both the events are performed on a button. For this purpose, we will first see on click event. Now to perform the on click event, we have created a button using a button tag. The event is called on the button tag. Whenever you want to perform some event on the particular HTML element, you have to include it in its tag. So here we are creating a button and we are performing the on click event. Whatever function you want to load on this event, give it as a parameter for this event. So I am giving the function as parameter for this on click. Then the click me is the label of your button that you are going to create. In the script, we are writing a function and this function will display a message hello world. So whenever this on click event will be fired. Now if I click on this button, this message will be displayed on the screen. So let's check the output of this on click event. So see here the button is created, the label is there. If I will click on this button, the message should be displayed on the screen as hello world. So here the message is displayed. In this way the on click event is working. The second event in this set is submit event or you can say on submit event. Now here we have called this on submit event on the form tag. So while creating the form tag, we are mentioning the on submit event. What happens is that here you are writing form. Then the name of event on submit equals to the function that you want to execute on submitting this event. Then you are creating a text box for entering the name and then you are creating one button known as submit which will have the value submit. In the script, the function is having an alert box which will display the message the form was submitted. So the simple logic of this program is that whenever the button will be clicked in this form at that time the alert box should be there with the message the form was submitted. So let's check whether it is working or not. So this is label, text box and submit. If I am giving some name here, so the message is displayed the form was submitted and if we click on OK, it will reset the values. So this is the use of on submit event. Let us see another two events on load and on blur. The on load event is called whenever the body part of the program is loaded on your web browser. Here you can see the coding of on load event. On the body tag, we are calling the on load and the function will be loaded as soon as the body tag loads the web browser or loads the page on the web browser. So let's check the script. In the script, the function is written as my function and it will have the alert as page is loaded. So let's check the output of this code. Here as soon as the page is loaded in the browser, the alert box is displayed. So on load event is called whenever you want to display the result immediately after the page is loaded into the memory. The next function or event is on blur event. Now let us see the use of on blur event. Here we have created a text box and on that text box, we are calling the event on blur. The function is passed as a parameter in this event. Let us see what the function is preparing here. Here in this function, X is a variable declared which is accepting fname. That means the name given in the text box. And then it will convert that value of text box into a case. So on blur event is triggered when you leave the input field. So let's check the output of the program. So this is the text box. Now if I am typing something on this text box, as soon as I leave this field, the output will be turned into uppercase. Whether you are using tag or mouse click anywhere input is changed from lowercase to uppercase. So this is the use of on blur event.