javascript demo presented by … jaisingh sumit jain sudhindra taran deep arora

16
JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Upload: victor-bradford

Post on 24-Dec-2015

213 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

JavaScript Demo

Presented by …

Jaisingh

Sumit jain

Sudhindra

Taran Deep arora

Page 2: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

JAVASCRIPT

• What Is JavaScript? • Core JavaScript• Client-Side JavaScript • Server-Side JavaScript • JavaScript and Java

Page 3: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

What Is JavaScript?

• JavaScript is Netscape's cross-platform, object-based scripting language.

• Core JavaScript contains a core set of objects and a core set of language elements .

• Client-Side JS extends the core language by supplying objects to control a browser (Navigator or another web browser) and its Document Object Model (DOM).

• Server-Side JS extends the core language by supplying objects relevant to running JavaScript on server.

Page 4: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

What Is JavaScript?

JavaScript lets you create Applications that run over the Internet. Dynamic HTML pages that process user input and

maintain persistent data using special objects, files, and relational databases .

Through JavaScript's Live Connect functionality, you can let Java and JavaScript code communicate with each other

Netscape invented JavaScript, and JavaScript was first used in Netscape browsers.

Page 5: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Core JavaScript

Client-side and server-side JavaScript have the following elements in common: -

• Keywords • Statement syntax and grammar • Rules for expressions, variables, and literals • Underlying object model (although client-side and

server-side JavaScript have different sets of predefined objects)

• Predefined objects and functions, such as such as Array, Date, and Math

Page 6: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Client-Side JavaScript

• Client-side JavaScript statements embedded in an HTML page

• Mechanism:-(i) Browser (or client) requests page(ii) Server sends the full page(HTML+Js) over the

network to client.(iii) Browser reads the page, displaying results of the

HTML and executing Js statements as they are encountered.

Page 7: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Client-Side JavaScript

• Responds to user events such as mouse clicks, form input, and page navigation.

• Without any network transmission, the embedded JavaScript checks the entered data and display a dialog box if the user enters invalid data.

Page 8: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Server-side JavaScript

• Server-side statements can connect to relational databases from different vendors, share information across users of an application, access the file system on the server, or communicate with other applications through livewire.

• HTML pages with server-side JavaScript can also include client-side JavaScript.

• Unlike pure client-side JavaScript pages, HTML pages that use server-side JavaScript are compiled into byte code executable files.

• Live Wire enables you to create and customize server-based application.

Page 9: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Server Side JavaScript

• With Live Wire , we can create dynamic HTML pages. Basic steps are: (1) Create the source files(JS embedded in HTML or JS only)(2) Compile the source files with the Live Wire compiler to create the byte code

executable .WEB file.Command line compiler: lwcomp -v -o myapp.web a.html b.html j.js

Page 10: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Steps of Execution• The server receives the request.• The server checks with Live Wire to see if it “wants” the

request.• The server turns the request over to Live Wire• Live Wire reads a predigested form of the HTML ( including

JS byte codes) from a binary file.• Live Wire attaches built-in objects with the JS context• Live Wire interprets the predigested form of the page and then

sends the resulting page over the to network the client.

Page 11: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Server-side JavaScript example The "initial page" for the JavaScript example program

<SERVER>

//     project.html – Live Wire and Server-Side JavaScript Implementation //  Example applications project file.  Establishes database connections // // //shared by all users of example application.

if (project.productDB == null) {    project.lock();    project.productDB = new Object();    project.productDB.pool =      new DbPool("ODBC",

“<ser-name>", “user", “****", " ", 5, false);    project.unlock(); } </SERVER>

Page 12: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Continued…..

The HTML file for the JavaScript home page <HTML><HEAD> <TITLE> Live Wire and Server-Side JavaScript Home Page </TITLE></HEAD> <BODY> <H2>List Generated Dynamically from Database Using Netscape Enterprise Server 3.0's Server-Side JavaScript and Live Wire</H2> <P>Click <A HREF=lw_category.html>here</A> to generate a list of  hyperlinks from the CATEGORY table. </P></BODY> </HTML >

Page 13: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Continued..

The HTML file for the JavaScript category page <HTML><HEAD> <SERVER> </SERVER> <TITLE>Categories</TITLE> </HEAD><BODY> <P> <B>Select a Category:</B> <UL> <SERVER> if (project.productDB.pool.connected()) {   var conn = project.productDB.pool.connection("conn",60);     conn.beginTransaction();     qs = "SELECT category_id, category_name from CATEGORY";      results = conn.cursor(qs);     while (results.next()) {           write("<LI><A HREF=\"lw_product.html?category_id="+results.category_id+"\">"   +results.category_name+“/A>\n");     }     results.close();     conn.commitTransaction();        conn.release(); } else {     write("<p>Database connection failed"); } </SERVER></UL> </CENTER> </BODY></HTML>

Page 14: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Continued….. The HTML file for the JavaScript product page <HTML><HEAD> <SERVER> </SERVER> <TITLE>Categories</TITLE> </HEAD><BODY> <P> <UL> <SERVER> if (project.productDB.pool.connected()) {    var iCategoryID = request.category_id;    var conn = project.productDB.pool.connection("conn",60);    conn.beginTransaction();    qs = "SELECT product_name from PRODUCT WHERE category_id =" + iCategoryID;     results = conn.cursor(qs);    while (results.next()) {          write("<LI>"+results.product_name+"</A>\n");    }    results.close();    conn.commitTransaction();    conn.release();    } else {         write("<p>Database connection failed");}</SERVER></UL> </BODY></HTML>

Page 15: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

JavaScript and JavaJavaScript Java

Interpreted (not compiled) by client. Compiled bytecodes downloaded from

server, executed on 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.

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.

Code integrated with, and embedded in, HTML.

Applets distinct from HTML (accessed from HTML pages

Variable data types not declared (dynamic typing).

Variable data types must be declared (static typing).

Cannot automatically write to hard disk. Cannot automatically write to hard disk

Page 16: JavaScript Demo Presented by … Jaisingh Sumit jain Sudhindra Taran Deep arora

Thank you……