JavaScript Designed By: By : Nivarutti Patil Introduction to JavaScript JavaScript is Netscape’s cross-platform, object-oriented scripting language. Core JavaScript contains a core set of objects, such as Array, Date, and Math, and a core set of language elements such as operators, control structures, and statements. Core JavaScript can be extended for a variety of purposes by supplementing it with additional objects Client-side JavaScript • control a browser and its Document Object Model (DOM). Server-side JavaScript • allow an application to communicate with a relational database, • provide continuity of information from one invocation to another of the application, or perform file manipulations on a server. JavaScript Characteristics JavaScript is Scripting Language JavaScript is an interpreted language (means that scripts execute without preliminary compilation) JavaScript is Object Orientated (JavaScript 1.3) JavaScript is Even Driven JavaScript is Platform-independent JavaScript enables Quick development JavaScript is relatively easy to learn JavaScript is supported by all major browsers, like Netscape and Internet Explorer What can a JavaScript Do? JavaScript gives HTML designers a programming tool JavaScript can put dynamic text into an HTML page JavaScript can react to events JavaScript can read and write HTML elements JavaScript can be used to validate data - A JavaScript can be used to validate form data before it is submitted to a server, this will save the server from extra processing Extension: Client vs. Server Client-Side Objects to control a browser Document Object Model – DOM Server-Side Communication with a relational database File manipulation on a server Continuity of information for applications Pros & Cons Pros Saves bandwidth Easy to implement Adds interaction Works well with HTML Cons Browser-specific DOM implementations security JavaScript & Java JavaScript Interpreted (not compiled) by client. Object-oriented. No distinction between types of objects. Inheritance is through the prototype mechanism, and properties and methods can be added to any object dynamically. Java Compiled bytecodes downloaded from server, executed on client Class-based. Objects are divided into classes and instances with all inheritance through the class hierarchy. Classes and instances cannot have properties or methods added dynamically. JavaScript How and Where How to Put a JavaScript Into an HTML Page Where to Put the JavaScript How to Run an External JavaScript Ending Statements With a Semicolon How to Handle Older Browsers Comments JavaScript Variables Variables A variable is a "container" for information you want to store. Variable names are case sensitive They must begin with a letter or the underscore character Declare a Variable var strname = some value Assign a Value to a Variable var strname = "Hege" or like strname = "Hege" Lifetime of Variables local variables ( inside Function) variable outside a function JavaScript Operators Arithmetic Operators Operator Description Example Result + Addition x=2x+2 4 Subtraction x=25-x 3 * Multiplication x=4x*5 20 / Division 15/5, 5/2 3, 2.5 % Modulus 5%2 10%8 10%2 120 ++ Increment x=5 x++ x=6 -Decrement x=5 x-- x=4 Assignment Operators Operator Example Is The Same As = x=y x=y += ,-=, *= , /=, %= Continued.. Comparison Operators Operator Description Example == is equal to 5==8 returns false === is equal to (checks for both value and type) x=5 EXAMPLE y="5" x==y returns true x===y returns false != is not equal 5!=8 returns true > is greater than 5>8 returns false < is less than 5<8 returns true >= is greater than or equal to 5>=8 returns false <= is less than or equal to 5<=8 returns true Continued.. Logical Operators Operator Description Example && || ! and or not x=6 y=3 (x < 10 && y > 1) returns true x=6 y=3 ( x == 5 || y == 5 ) returns false x=6 y=3 !( x == y ) returns true String Operator txt1="What a very“ txt2="nice day!“ txt3=txt1+txt2 JavaScript Conditional Statements Conditional Statements Very often when you write code, you want to perform different actions for different decisions. You can use conditional statements in your code to do this. In JavaScript we have three conditional statements: if statement - use this statement if you want to execute a set of code when a condition is true if...else statement - use this statement if you want to select one of two sets of lines to execute if...else if....else statement - use this statement if you want to select one of many sets of lines to execute switch statement - use this statement if you want to select one of many sets of lines to execute Conditional Operator JavaScript also contains a conditional operator that assigns a value to a variable based on some condition. Syntax variablename=(condition)?value1:value2 Example greeting=(visitor=="PRES")?"Dear President ":"Dear " JavaScript Looping In JavaScript we have the following looping statements: • while - loops through a block of code while a condition is true • do...while - loops through a block of code once, and then repeats the loop while a condition is true • for - run statements a specified number of times Summary Scripting languages were developed to overcome the drawbacks of HTML. Disadvantages of HTML: Client –Side validation not possible in HTML. Does not provide event-handling and other features required to make Web pages more interactive. JavaScript was developed by Netscape. It was initially called LiveScript. JavaScript can be used to client side as well as server-side scripts. JavaScript is interpreted on the client side by browser, Unlike Java or any other programming language. JavaScript does not require the definition of variable datatypes JavaScript can be embedded in HTML. (Inside head, body and external file as well) A variable can be a local variable or global variable. Continued.. Programming constructs offer methods of controlling the flow of program. There are two types of constructs: Conditional Iterative Following are the different types of conditional constructs: If…else Additional conditions If…else if…else Switch case There are the types if iterative constructs: While Do…While For The following two statements help control expression in loop: Break Continue