JavaScript Scripting language

What is Scripting ? A scripting language, script language, or extension language is a programming language that allows control of one or more applications. Scripts are often interpreted from source code or bytecode, whereas the application is typically first compiled to native machine code

What is Client Side Scripting ? Client Side Scripting: Client-side scripting generally refers to the class of computer programs on the web that are executed client-side, by the user's web browser, instead of server-side (on the web server)

Client-Side Scripting Languages Netscape and others – JavaScript Internet Explorer – Jscript (MS name for JavaScript) – VBScript – PerlScript

What is JavaScript JavaScript was designed to add interactivity to HTML pages JavaScript is a scripting language (a scripting language is a lightweight programming language) A JavaScript consists of lines of executable computer code A JavaScript is usually embedded directly into HTML pages JavaScript is an interpreted language (means that scripts execute without preliminary compilation) Everyone can use JavaScript without purchasing a license

Why do we use JavaScript ? Add content to a web page dynamically. Alter a web page in response to user actions. React to user events. Interact with frames. Manipulate HTTP cookies

Features Browser support Detecting user’s browser and OS Can be used on Server as well as Client Performing simple Computation Support objects

Structure of JavaScript program JavaScript Page document.write("Hello world!"); Content of the Page

JavaScript and HTML Comments <!-- document.write(“Hello World"); --> HTML comment

Language Elements Variables Literals Operators Control Structures Objects Arrays

Variables Untyped! Can be declared with var keyword: var foo; Can be created automatically by assigning a value: foo=1; blah="Hi Dave";

Variables (cont.) Using var to declare a variable results in a local variable (inside a function). If you don't use var – the variable is a global variable

Literals(Values) Values are bits of information. Values types and some examples include: – Number: 1, 2, 3, etc. – String: characters enclosed in quotes. “Hi” – Boolean: true or false. – Object: image, form – Function: validate(), doWhatever()

Expressions Expressions are commands that assign values to variables. Expressions always use an assignment operator, such as the equals sign. – e.g., var month = May; is an expression. Expressions end with a semicolon

Operators Arithmetic, comparison, assignment, bitwise, boolean (pretty much just like C). + - * / % == != > < && || ! & | >

Control Structures Again – pretty much just like C: if if-else ?: switch for while do-while And a few not in C for (var in object) with (object)

Function function functionname (Parameter list) { Commands; return value; } The two parts of a JavaScript function are ✦ Parameter list: Defines any data and their data types that the function needs to work. If the function doesn’t need to accept any values, the parameter list can be empty. ✦ Return: Defines a value to return

User-defined functions function definitions are similar to C++/Java, except: – no return type for the function (since variables are loosely typed) – no types for parameters (since variables are loosely typed) – by-value parameter passing only (parameter gets copy of argument) function isPrime(n) // Assumes: n > 0 // Returns: true if n is prime, else false { if (n < 2) { return false; } else if (n == 2) { return true; } else { for (var i = 2; i <= Math.sqrt(n); i++) { if (n % i == 0) { return false; } return true; } can limit variable scope if the first use of a variable is preceded with var, then that variable is local to the function for modularity, should make all variables in a function local

Embedding JavaScript in HTML. When specifying a script only the tags and are essential, but complete specification is recommended: <script language="javascript” type="text/javascript"> <!-- Begin hiding window.location=”index.html" // End hiding script-->

Objects Objects have attributes and methods. Many pre-defined objects and object types. Using objects follows the syntax of C++/Java: objectname.attributename objectname.methodname()

Array Objects Arrays are supported as objects. Attribute length Methods include: Concat() join() pop() push() reverse() sort()

Array example code var a = [8,7,6,5]; for (i=0;i<a.length;i++) a[i] += 2; b = a.reverse();

Many other pre-defined object types String : manipulation methods Math : trig, log, random numbers Date : date conversions RegExp : regular expressions Number : limits, conversion to string

Alert Box An alert dialog box displays a message on the screen and gives the user the option of closing the dialog box. To create an alert dialog box, you need to define the text you want displayed, such as alert(“Message here”); An alert dialog box displays an OK button. As soon as the user clicks this OK button, the alert dialog box goes away

Confirmation Box A confirmation dialog box displays a message and offers the user two or more choices. A confirmation dialog box gives users a choice of OK and Cancel buttons. To create a confirmation dialog box, you must display text and include commandsthat do something when the user clicks either OK or Cancel: if (confirm(“Text message”)) command; else command;

Prompt Box A prompt dialog box gives users a chance to type in data. To create a prompt dialog box, you need to display text to appear in the dialog box and then optional text to appear as a default value, such as prompt(“Text to display”, optionalvalue);

Simple program using JavaScript <!-- function hello() { document.write("Hello,This is JavaScript Output"); } -->

Queries ??