Presentation is loading. Please wait.

Presentation is loading. Please wait.

Javascript Client-side scripting. Up to now  We've seen a little about how to control  content with HTML  presentation with CSS  Javascript is a language.

Similar presentations


Presentation on theme: "Javascript Client-side scripting. Up to now  We've seen a little about how to control  content with HTML  presentation with CSS  Javascript is a language."— Presentation transcript:

1 Javascript Client-side scripting

2 Up to now  We've seen a little about how to control  content with HTML  presentation with CSS  Javascript is a language that can be used to control browser actions

3 Javascript language  General-purpose language designed to be embedded within other applications  C-like syntax  Object-oriented  Interpreted  Built-in garbage collection  Support for regular expressions  Built-in security - can't read local files or do networking

4 What JavaScript can do  Control document appearance and content  Control the browser  Interact with forms  Validate user input  Interact with user  Use cookies

5 JavaScript is several languages  JavaScript - implemented by Netscape (and later Mozilla)  http://www.mozilla.org/js/ http://www.mozilla.org/js/  Jscript - Microsoft version  ECMAScript -standardized version of the language  http://www.ecma- international.org/publications/standards/Ecma-327.htm  JavaScript is not related to Java

6 How to use JavaScript  JavaScript can be embedded into your html pages in a couple of ways  in elements in both and elements of page  in event attributes of appropriate elements  You can also reference external files containing JavaScript code 

7 Basic Syntax  Case-sensitive  Insensitive to whitespace  ; line terminator is optional (unless result is ambiguous)  // and /* … */ comments  Same rules for identifiers as Java

8 Variables  Must be declared before they can be used var i; var x, y;  using undeclared variable causes an implicit declaration - resulting variable is global  variables declared in functions are local  Untyped  can be assigned to values of any type

9 Types  Primitive types  numbers  strings  booleans - true or false  &&, || and !  null  undefined  Reference types  objects: unordered collection of named values  arrays: ordered collection of unnamed values  functions  special classes  Date  RegExp

10 Numbers  Numbers - all stored using IEEE 754 64-bit standard  Literals  integer : 0 7 1300  Hex : 0xff 0xCAFE911  Octal : 0377  Floating point : 3.14.333 6.02e23 1.6e-19  Operations: standard arithmetic, functions of Math object, relational operators, bitwise operators  Special values: Infinity, NaN, Number properties

11 Strings  Sequence of Unicode characters  Literals can be enclosed in either single or double quotes  Escape sequences include the ones you are used to plus the ability to represent a character by its Unicode ( \uXXXX )  Concatenate with +

12 String properties and methods  length - the number of characters in the string  charAt( index) - index from 0  substring( start, endPlus1)  use + to concatenate strings

13 Functions  A piece of executable code  First-class objects  Definition function square(x) {return x*x; }  Literal functions var square = function(x){return x*x; } var square = new Function( "x", "return x*x;”);

14 Objects  An object is collection of named values which are referred to as the properties of the object  property that is a function is called a method  Objects are created with new var o = new Object()  Object literals var point = {x:2.3, y:-1.2}

15 Using Objects  Once the object is created, you can add and use whatever properties you need var point = new Object(); point.x = 2.3; point.y = -1.2  Use the in operator to check if an object has a particular property var hasXcoord = "x" in point;

16 Arrays  Arrays are indexed collections of data values  size is dynamic  Creating arrays var a = new Array(); // now add elements a[0] = 1.2; a[1]="JavaScript"; … var b = new Array( 1.2, "JavaScript", true, …} var c = new Array(5); //5-element array  Array Literals var a = [1.2, "JavaScript", true, {x:1, y:3}]

17 Statement Types  Expression statements have side effects  Assignment - both simple ( = ) and compound ( +=, -=, …)  delete  function calls (with no return value)  Compound statements - enclosed in { }  no block scope in JavaScript  var for declaring variables

18 Selection  if if (cond1) stmt1; elseif (cond2) stmt2; … else stmtLast;  switch switch (n) { case 1: block1; break; … default: defaultBlock; }

19 Repetition  while while (cond) stmt;  do/while do stmt; while (cond);  for for (init; test; update) stmt;  for/in for (var in obj) stmt; loops through elements of array or properties of object

20 More statement types  function  return  throw  try/catch/finally  with - used to temporarily modify scope chain  ; is empty statement

21 Sources  Web Design and Programming by Paul S. Wang and Sanda S. Katila  JavaScript The Definitive Guide by David Flanagan  http://wp.netscape.com/eng/mozilla/3.0/han dbook/javascript/ http://wp.netscape.com/eng/mozilla/3.0/han dbook/javascript/  http://www.ecma- international.org/publications/standards/Ecma- 262.htm


Download ppt "Javascript Client-side scripting. Up to now  We've seen a little about how to control  content with HTML  presentation with CSS  Javascript is a language."

Similar presentations


Ads by Google