Cordova training : Day 3 - Introduction to Javascript
Download as PPTX, PDF0 likes245 views
This document provides an introduction to JavaScript, including: - JavaScript is a lightweight, interpreted programming language commonly used in web pages. - Advantages of JavaScript include less server interaction, immediate feedback, and richer interfaces. - Disadvantages include inability to read/write files for security and lack of multithreading. - JavaScript syntax can be included in HTML using <script> tags and ignores spaces/newlines. - Basic data types are strings, numbers, and Booleans, and variables are declared with var. - Common operators include arithmetic, comparison, logical, and assignment operators. - Control structures include if/else statements, switch statements, for/while loops. - Functions are reusable blocks
Cordova training : Day 3 - Introduction to Javascript
- 1. CORDOVA TRAINING SESSION: 3 – INTRODUCTION TO JAVASCRIPT
- 2. INTRODUCTION TO JAVASCRIPT Javascript is a dynamic computer programming language. It is lightweight and most commonly used as a part of web pages. JavaScript is a lightweight, interpreted programming language. Designed for creating network-centric applications. Complementary to and integrated with Java. Complementary to and integrated with HTML. Open and cross-platform
- 3. ADVANTAGES OF JAVASCRIPT The merits of using JavaScript are: Less server interaction Immediate feedback to the visitors Increased interactivity Richer interfaces
- 4. DIS-ADVANTAGES OF JAVASCRIPT The demerits of using JavaScript are: Client-side JavaScript does not allow the reading or writing of files. This has been kept for security reason. JavaScript cannot be used for networking applications because there is no such support available. JavaScript doesn't have any multithreading or multiprocessor capabilities.
- 5. SYNTAX JavaScript can be implemented using JavaScript statements that are placed within the <script>... </script> HTML tags in a web page. You can place the <script> tags, containing your JavaScript, anywhere within you web page, but it is normally recommended that you should keep it within the <head> tags. <script language="javascript" type="text/javascript"> JavaScript code </script>
- 6. SYNTAX JavaScript ignores spaces, tabs, and newlines that appear in JavaScript programs. Simple statements in JavaScript are generally followed by a semicolon character, just as they are in C, C++, and Java. JavaScript is a case-sensitive language. This means that the language keywords, variables, function names, and any other identifiers must always be typed with a consistent capitalization of letters.
- 7. COMMENTS JavaScript supports both C-style and C++-style comments: Any text between a // and the end of a line is treated as a comment and is ignored by JavaScript. Any text between the characters /* and */ is treated as a comment. This may span multiple lines.
- 8. INCLUDING JAVASCRIPT IN A PAGE There is a flexibility given to include JavaScript code anywhere in an HTML document. However the most preferred ways to include JavaScript in an HTML file are as follows: Script in <head>...</head> section Script in <body>...</body> section Script in an external file and then include in <head>...</head> section <script type="text/javascript" src="filename.js" ></script>
- 9. JAVASCRIPT VARIABLES One of the most fundamental characteristics of a programming language is the set of data types it supports. JavaScript allows you to work with three primitive data types: String Number Boolean : true | false
- 10. JAVASCRIPT VARIABLES Like many other programming languages, JavaScript has variables. Variables can be thought of as named containers. You can place data into these containers and then refer to the data simply by naming the container. Before you use a variable in a JavaScript program, you must declare it. Variables are declared with the var keyword var name;
- 11. JAVASCRIPT RESERVED KEYWORDS A list of all the reserved words in JavaScript are given in the following table. They cannot be used as JavaScript variables, functions, methods, loop labels, or any object names.
- 13. OPERATORS Let us take a simple expression 4 + 5 is equal to 9. Here 4 and 5 are called operands and ‘+’ is called the operator. JavaScript supports the following types of operators: Arithmetic Comparision Logical Assignment Conditional
- 14. ARITHMETIC OPERATORS JavaScript supports the following arithmetic operators: + (Addition) - (Subtraction) * (Multiplication) / (Division) % (Modulus) ++ (Increment) -- (Decrement)
- 15. COMPARISION OPERATORS JavaScript supports the following comparison operators: = = (Equal) != (Not Equal) > (Greater than) >= (Greater than or Equal to) < (Less than) <= (Less than or Equal to)
- 16. LOGICAL OPERATORS JavaScript supports the following logical operators: && (Logical AND) || (Logical OR) ! (Logical NOT)
- 17. ASSIGNMENT OPERATORS JavaScript supports the following assignment operators: = (Simple Assignment ) += (Add and Assignment) −= (Subtract and Assignment) *= (Multiply and Assignment) /= (Divide and Assignment) %= (Modules and Assignment)
- 18. CONDITIONAL OPERATORS The conditional operator first evaluates an expression for a true or false value and then executes one of the two given statements depending upon the result of the evaluation. ? : (Conditional ) If Condition is true? Then value X : Otherwise value Y
- 19. IF-ELSE STATEMENT While writing a program, there may be a situation when you need to adopt one out of a given set of paths. In such cases, you need to use conditional statements that allow your program to make correct decisions and perform right actions. if (expression) { Statement(s) to be executed if expression is true } else{ Statement(s) to be executed if expression is false }
- 21. SWITCH CASE STATEMENT We can use a switch statement to handle a situation where repeated if...else if statements are required. switch (expression) { case condition 1: statement(s) break; case condition 2: statement(s) break; default: statement(s) }
- 23. LOOPS You may encounter a situation where you need to perform an action over and over again. In such situations, you would need to write loop statements. Javascript supports the following types of loops: for loop while loop
- 24. FOR LOOP The 'for' loop is the most compact form of looping. It includes the following three important parts. loop initialization test statement iteration statement for (initialization; test condition; iteration statement) { Statement(s) to be executed if test condition is true }
- 25. FOR LOOP
- 26. WHILE LOOP The purpose of a while loop is to execute a statement or code block repeatedly as long as an expression is true. Once the expression becomes false, the loop terminates. while (expression){ Statement(s) to be executed if expression is true }
- 27. WHILE LOOP
- 28. LOOP CONTROL JavaScript provides full control to handle loops and switch statements. There may be a situation when you need to come out of a loop without reaching at its bottom. There may also be a situation when you want to skip a part of your code block and start the next iteration of the look. To handle all such situations, JavaScript provides break and continue statements.
- 29. BREAK STATEMENT The break statement, which was briefly introduced with the switch statement, is used to exit a loop early, breaking out of the enclosing curly braces. break;
- 30. CONTINUE STATEMENT The continue statement tells the interpreter to immediately start the next iteration of the loop and skip the remaining code block. When a continue statement is encountered, the program flow moves to the loop check expression immediately and if the condition remains true, then it starts the next iteration, otherwise the control comes out of the loop. continue;
- 31. FUNCTIONS A function is a group of reusable code which can be called anywhere in your program. This eliminates the need of writing the same code again and again. It helps programmers in writing modular codes. Before we use a function, we need to define it. The most common way to define a function in JavaScript is by using the function keyword, followed by a unique function name, a list of parameters (that might be empty), and a statement block surrounded by curly braces. function functionname (parameter-list) { statements }
- 32. FUNCTIONS To invoke a function somewhere later in the script, you would simply need to write the name of that function as shown in the following code. A function can take multiple parameters separated by comma. A JavaScript function can have an optional return statement. This is required if you want to return a value from a function. This statement should be the last statement in a function.
- 33. ALERT DIALOG BOX An alert dialog box is mostly used to give a message to the users. For example, if one input field requires to enter some text but the user does not provide any input, then as a part of validation, you can use an alert box to give a warning message. alert(message);
- 34. CONFIRM DIALOG BOX A confirmation dialog box is mostly used to take user's consent on any option. It displays a dialog box with two buttons: OK and Cancel. If the user clicks on the OK button, the window method confirm() will return true. If the user clicks on the Cancel button, then confirm() returns false. var retValue = confirm(message);
- 35. PROMPT DIALOG BOX The prompt dialog box is very useful when you want to pop-up a text box to get user input. Thus, it enables you to interact with the user. The user needs to fill in the field and then click OK. This dialog box is displayed using a method called prompt() which takes two parameters: (i) a label which you want to display in the text box and (ii) a default string to display in the text box. var retVal = prompt(message, defaultValue);
- 36. THANK YOU