Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Introduction to JavaScript Fort Collins, CO Introduction to JavaScript Programming Instructor: Joseph DiVerdi, Ph.D., MBA Copyright © XTR Systems, LLC JavaScript In Brief Introduction to JavaScript Fort Collins, CO • JavaScript Is – – – – Object-oriented, Client-side, Scripting Language Permits Executable Content in Web Pages Derived From C/C++ & Perl Totally Unrelated to Java • It Is Not “Java Light” – Not a Simple Language – Most Popular Language for • Client-side Web Programming Copyright © XTR Systems, LLC Introduction to JavaScript Fort Collins, CO Client-Side Language • JavaScript Is Executed by the Web Client – That's the Browser Program on Your Desktop – Web Client Contains a JavaScript Engine • Web Server Does Not Execute JavaScript • JavaScript Is Placed Directly in an HTML Document – Delivered Just Like HTML • Also Contained in Separate Documents – Referenced in HTML Documents Copyright © XTR Systems, LLC Introduction to JavaScript Fort Collins, CO Scripting Language • Difference Between Scripting & Programming Languages Is Increasingly Small – More Semantic Than Significant • Scripting Language Is a Marketing Term – Scripting Is Easier Than Programming!?! • JavaScript Is Not Compiled – Source Code Is Distributed to Client – Difficult to Hide Source Code • Almost Impossible Copyright © XTR Systems, LLC Executable Content Introduction to JavaScript Fort Collins, CO • Web Page Needn’t Be Limited to Static HTML • Include Dynamic Content Which: – – – – Interacts With the Viewer Controls the Browser (Ouch!) Dynamically Creates HTML Content Interacts With Java Applets Running on Client • Commonality With CGI Programming but Significant Differences – CGI Is Server-side – CGI Uses Many Different Programming Languages • Perl, Java, C/C++, Applescript, Visual Basic, etc. Copyright © XTR Systems, LLC Introduction to JavaScript Fort Collins, CO Powerful Language • Display Additional Information About Links • Create Mouse Rollover Effects • Change Page Contents – Depending on Certain Conditions • • • • • Randomly Display Content on a Page Move Elements Around on a Page Load Content in New Windows & Frames Interact With Cookies Interact With User Through Event Handlers Copyright © XTR Systems, LLC Introduction to JavaScript Fort Collins, CO Limited Language • Cannot Create Graphics • Limited Ability to Perform Networking Tasks – Request Content Through URL – Send Content to Servers & Mailer • Cannot Read or Write to Client's Disks • Does Not Support Multithreading – Only One Task Can Be Performed At a Time • Viewer Has to Wait... Copyright © XTR Systems, LLC Tricky Language Introduction to JavaScript Fort Collins, CO • Looks About As Complicated As BASIC • Is Much More Complex Than BASIC – Use of Objects – Arguments to Functions Requires Careful Understanding of Argument Passing • By–value • By–reference • Lots of Non-intuitive Aspects • Lots of Very Tricky Details Copyright © XTR Systems, LLC Unrelated to Java Introduction to JavaScript Fort Collins, CO • Java Is a Compiled Programming Language – Created and Owned by Sun Microsystems • “...The Same Software Should Run on Many Different Kinds of Computers & Other Gadgets…” • A Java Engine Is Included in Web Browsers • Java Programs Are Often Called Applets – Little Applications – Running Is a Specialized Environment • Java Programs Are Also Running Without Browsers on Many Large Computers – Mainframes Copyright © XTR Systems, LLC Politics, politics, politics... Introduction to JavaScript Fort Collins, CO • The Name JavaScript Is Owned by Netscape • Microsoft’s Implementation Is Officially Known As JScript – Very Few Make a Distinction Between the Two • JScript Versions Generally Track With JavaScript Versions Copyright © XTR Systems, LLC Politics, politics, politics... Introduction to JavaScript Fort Collins, CO • JavaScript Has Been Standardized by ECMA – European Computer Manufacturers Association • Defined a Language Known As ECMAscript – Chosen to Favor No One • Aka A Name No One Could Love Copyright © XTR Systems, LLC Introduction to JavaScript Fort Collins, CO Object -Oriented Language • Different Style of Programming – Traditional Programming Called Function-oriented • Data & Functions – Useful Modern Way of Thinking About Programs • Some Definitions: Object: a Data Structure With a Collection of Behaviors That Can Be Performed on It Method: a Behavior Performed on an Object Class: a Definition of Methods Inherit: Receive Definitions Instance: Individual Representative of a Category Copyright © XTR Systems, LLC Introduction to JavaScript Fort Collins, CO Example Syntax • Two Parts to Most JavaScript: – Function Definitions Tell the Browser What to Do • Not Required – References To Those Functions • Required Copyright © XTR Systems, LLC Introduction to JavaScript Fort Collins, CO Example Syntax • Function Definitions – May Be Contained Directly in an HTML Page – Or in a Separate JavaScript Document • References Are Contained in HTML Pages – These Are Code to Be Executed Copyright © XTR Systems, LLC Embedded Example Introduction to JavaScript Fort Collins, CO <!DOCTYPE HTML PUBLIC ... > <HTML> <HEAD><TITLE>Status Line Example</TITLE></HEAD> <BODY> <A HREF ="http://www.disney.com" ONMOUSEOVER="window.status='Go to the Magic Kingdom?'; return true;">Disney</A> <A HREF="http://www.wwf.com" ONMOUSEOVER="window.status='Most Polite People on Earth'; return true;">WWF</A> </BODY> </HTML> Copyright © XTR Systems, LLC Embedded <SCRIPT> Example Introduction to JavaScript Fort Collins, CO <!DOCTYPE HTMLPUBLIC ... > <HTML> <HEAD><TITLE>Browser Identity Example</TITLE></HEAD> <BODY> You are using: <SCRIPT TYPE="text/javascript"> document.write(navigator.appName + ' - ' + navigator.appVersion); </SCRIPT> </BODY> </HTML> Copyright © XTR Systems, LLC External Reference Example Introduction to JavaScript Fort Collins, CO <!DOCTYPE HTML PUBLIC ... > <HTML> <HEAD> <SCRIPT TYPE="text/javascript" SRC="/~diverdi/my_script.js"></SCRIPT> <TITLE>Today's Date</TITLE> </HEAD> <BODY> The current date and time are: <SCRIPT TYPE="text/javascript">get_date();</SCRIPT> </BODY> </HTML> Copyright © XTR Systems, LLC Common JavaScript Directory Introduction to JavaScript Fort Collins, CO Copyright © XTR Systems, LLC Contents of my_script.js Introduction to JavaScript Fort Collins, CO // my_script.js /* JavaScript function which returns a formatted string containing the current date */ function get_date() { variable my_date = new Date(); return my_date.toDateString; } Copyright © XTR Systems, LLC Online Examples Introduction to JavaScript Fort Collins, CO • Excellent Set of Examples Available Online At: http://examples.oreilly.com/jscript3/ http://examples.oreilly.com/jscript4/ • Both Sites Are Useful Because They Provide Many of the Same Examples but Present Them Using Different Styles Copyright © XTR Systems, LLC