Javascript variables and datatypes

 JavaScript variables are used to hold values or expressions  Rules for JavaScript variable names  Variable names are case sensitive  Variable names must begin with a letter or the underscore character

 Declaring (Creating) JavaScript Variables  var x;  var carname;  Assign values to the variables  while declaring them ▪ var x=5; ▪ var carname="Volvo";  With assignment statements ▪ x=5; ▪ carname="Volvo";

 Numbers - are values that can be processed and calculated - either positive or negative  Strings - are a series of letters and numbers enclosed in quotation marks  Boolean (true/false) - lets you evaluate whether a condition meets or does not meet specified criteria  Null - is an empty value. Null is not the same as 0  0 is a real, calculable number,whereas null is the absence of any value.

 Integers  Decimal (base 10) - A normal integer without a leading 0 (zero) (ie, 752)  Octal (base 8) - An integer with a leading 0 (zero) (ie, 056)  Hexadecimal (base 16) - An integer with a leading 0x or 0X (ie, 0x5F or 0XC72)

 Floating Point Values - Floating point values can include a fractional component.  A floating-point literal includes ▪ A decimal integer plus either a decimal point and a fraction expressed as another decimal number or an expression indicator and a type suffix ▪ 7.2945 ▪ -34.2 ▪ 2e3 means 2 x 103 => 2000 ▪ 2E-3 means 2 x 10-3 => .002

 Strings  Technically, a string literal contains zero or more characters enclosed, as you know, in single or double quotes: ▪ "Hello!" ▪ ‘245’ ▪ "" // This example is called the empty string

 A JavaScript statements is a command to the browser.  The purpose of the command is to tell the browser what to do.  document.write("Hello Dolly");

 JavaScript Blocks  JavaScript statements can be grouped together in blocks  Blocks start with a left curly bracket {, and ends with a right curly bracket }.  The purpose of a block is to make the sequence of statements execute together

 = is used to assign values  + is used to add values y=5; z=2; x=y+z;  The value of x, after the execution of the statements above is 7.

 Arithmetic operators are used to perform arithmetic between variables and/or values + Addition x=y+2 x=7 - Subtraction x=y-2 x=3 * Multiplication x=y*2 x=10 / Division x=y/2 x=2.5 % Modulus x=y%2 x=1 ++ Increment x=++y x=6 -- Decrement x=--y x=4

 The + Operator Used on Strings  Used to add string variables or text values together txt1="What a very"; txt2="nice day"; txt3=txt1+txt2; txt1="What a very"; txt2="nice day"; txt3=txt1+txt2; "What a verynice day"

txt1="What a very "; txt2="nice day"; txt3=txt1+txt2; • or insert a space into the expression: txt1="What a very"; txt2="nice day"; txt3=txt1+" "+txt2; "What a very nice day"

 Comparison Operators == is equal to x==8 is false === is exactly equal to (value and type) != is not equal x!=8 is true > is greater than x>8 is false < is less than x<8 is true >= is greater than or equal to x>=8 is false <= is less than or equal to x<=8 is true

if (age<18) document.write("Too young");

 Logical Operators && and (x < 10 && y > 1) is true || or (x==5 || y==5) is false ! not !(x==y) is true

 Conditional Operator  assigns a value to a variable based on some condition  Syntax variablename=(condition)?value1:value2  Example greeting=(visitor=="PRES")?"Dear President ":"Dear ";

 Conditional Statements if (condition) { code to be executed if condition is true }

 Literal values are the ones you type into mathematical or string expressions ▪ 23 (an integer), ▪ 12.32E23 (a floating point), ▪ 'flopsy the Hamster' (a string)

 Five special characters b Backspace f Form Feed n New Line r Carriage Return t Tab

 A function will be executed by an event or by a call to the function <html> <head> <script type="text/javascript"> function product(a,b) { return a*b; } </script> </head> <body> <script type="text/javascript"> document.write(product(4,3)); </script> </body> </html>

<html> <head> <script type="text/javascript"> function myfunction(txt) { alert(txt); } </script> </head> <body> <form> <input type="button" onclick="myfunction('Hello')" value="Call function"> </form> <p>By pressing the button above, a function will be called with "Hello" as a parameter. The function will alert the parameter.</p> </body> </html>

 Object used to store multiple values in a single variable 1: var myCars=new Array(); // regular array (add an optional integer myCars[0]="Saab"; // argument to control array's size) myCars[1]="Volvo"; myCars[2]="BMW";

2: var myCars=new Array("Saab","Volvo","BMW"); // condensed array 3: var myCars=["Saab","Volvo","BMW"]; // literal array

 Access an Array document.write(myCars[0]);  Modify Values in an Array myCars[0]="Opel";

 Join two arrays - concat()  Join three arrays - concat()  Join all elements of an array into a string - join()  Remove the last element of an array - pop()  Add new elements to the end of an array - push()  Reverse the order of the elements in an array - reverse()  Remove the first element of an array - shift()  Select elements from an array - slice()  Sort an array (alphabetically and ascending) - sort()  Sort numbers (numerically and ascending) - sort()  Sort numbers (numerically and descending) - sort()  Add an element to position 2 in an array - splice()  Convert an array to a string - toString()  Add new elements to the beginning of an array - unshift()

 JavaScript Objects represent self contained entities consisting of  Variables (called properties in object terminology)  Functions (called methods) that can be used to perform tasks and store complex data.

 Categories 1. Built-in Objects 2. Custom Objects 3. Document Object javaobjects.html

 document.write(txt.toUpperCase());  new Date() // current date and time  new Date(milliseconds) //milliseconds since 1970/01/01  new Date(dateString)  new Date(year, month, day, hours, minutes, secon ds, milliseconds)

var myDate=new Date(); myDate.setFullYear(2010,0,14); var today = new Date(); if (myDate>today) { alert("Today is before 14th January 2010"); } else { alert("Today is after 14th January 2010"); }

 Firebug is a powerful extension for Firefox that has many development and debugging tools including JavaScript debugger and profiler  Venkman JavaScript Debugger (for Mozilla based browsers such as Netscape 7.x, Firefox/Phoenix/Firebird and Mozilla Suite 1.x)

 Microsoft Script Debugger (for Internet Explorer) The script debugger is from the Windows 98 and NT era  Microsofts Visual Web Developer Express is Microsofts free version of the Visual Studio IDE. It comes with a JS debugger

 JTF: JavaScript Unit Testing Farm  Collaborative website that enables you to create test cases that will be tested by all browsers

 Be sure that every "(" is closed by a ")" and every "{" is closed by a "}“  case sensitive  Don't use Reserved Words as variable names, function names or loop labels  Escape quotes in strings with a "“  alert('He's eating food'); should be alert('He's eating food'); or alert("He's eating food");

Javascript variables and datatypes

In this document

More Related Content

What's hot

Viewers also liked

Similar to Javascript variables and datatypes

Javascript variables and datatypes