Client-side Web Scripting Lecture Notes

Client-Side Web Scripting • allows programs (i.e., scripts) to be downloaded from the web server and executed on the client (i.e., browser) • common client-side scripting technologies: o JavaScript, ECMAScript, JScript o VBScript, ActionScript o Java applets, ActiveX controls, Flash animations • common uses: o dynamic (X)HTML ƒ page embellishments and special visual “effects”, content generation and manipulation, user interaction, document and page navigation, etc. o form validation o asynchronous/partial content retrieval, RIA technologies (e.g., AJAX) • common issues: o browser support ƒ no scripting support ƒ scripting disabled ƒ plugin availability o version incompatibilities, non-standard implementations o capability restrictions ƒ scripting languages are not general-purpose programming languages ƒ e.g., JavaScript is restricted by the sandbox execution model and the same origin policy o security risks ƒ browser implementation defects (e.g., buffer overflows) ƒ e.g., for JavaScript, cross-site scripting (XSS) or cross-site request forgery (XSRF) issues ƒ malicious ActiveX controls JavaScript • developed by Brendan Eich at Netscape Communications as the scripting language for the Netscape Navigator browser • formerly called Mocha, then LiveScript, then JavaScript • standardized by Ecma International as ECMAScript • latest version: JavaScript 1.8 • common version: JavaScript 1.5, JScript 5.5, ECMAScript v3 (ECMA262 3rd edition) • linked/embedded in web pages using the <script> element o linked: <script type=”text/javascript” src=”scripts.js” />

• •

o embedded (either in the or the element): <script type=”text/javascript”> JavaScript + DOM/BOM + CSS + (X)HTML = DHTML basic language features: o paradigm: ƒ object-oriented (prototype-based), functional, imperative, scripting language o Java-/C-like syntax: ƒ implicit semicolon insertion for statement termination ƒ identifiers use alphanumeric, _, and $ characters ƒ case-sensitive keywords and identifiers ƒ single-line (//) or block (/* */) comments o type system and variable scoping rules: ƒ dynamic (a.k.a. loose or weak) typing ƒ global (a.k.a. top-level) or local scopes ƒ data types: • primitive types o numbers (decimal, hexadecimal notation) o booleans (true, false) o strings (single or double quote delimited) o undefined and null • composite (object) types o core JavaScript objects ƒ Object, Number, Boolean, String, Date, Math, Global, RegExp, Error ƒ arrays (Array) ƒ functions (Function, Arguments) o client-side JavaScript objects ƒ Window, Navigator, Screen, Document, Location, History ƒ Anchor, Applet, Attr, Comment, DOMException, DOMImplementation, DocumentFragment, Element, Event, Form, Image, Input, Layer, Link, Node, Option, Select, Style, Text, TextArea o keywords: ƒ break, case, catch, continue, default, delete, do, else, false, finally, for, function, if, in, instanceof, new, null, return, switch, this, throw, true, try, typeof, var, void, while, with o reserved words (for possible future language extensions): ƒ abstract, boolean, byte, char, class, const, debugger, double, enum, export, extends, final, float, goto, implements, import, int, interface, long, native, package, private, protected, public, short, static, super, synchronized, throws, transient, volatile o operators ƒ . [] () new ++ -- + - * / % = compound assignment operators == != < <= > >= === !== && || ! & | ^ ~ << >> >>> ?: , delete typeof instanceof in void o statements and control structures ƒ var ƒ if-else • condition expressions having values of 0, ””, null, and undefined evaluate to false ƒ switch-case-default-break • allows any expression type as the switch expression • can use expressions as case labels • with fall-through functionality ƒ while, do-while, for, for-in, break, continue ƒ try-catch-finally, throw • throw and catch can handle any expression type ƒ function, return ƒ with