Java Script

JavaScript Date Object The Date object is used to work with dates and times.  Date objects are created with the Date() constructor. There are four ways of instantiating a date: new Date() // current date and time new Date(milliseconds) //milliseconds since 1970/01/01 new Date(dateString) new Date(year, month, day, hours, minutes, seconds, milliseconds)

JavaScript Date Object Once a Date object is created, a number of methods allow you to operate on it. Most methods allow you to get and set the year, month, day, hour, minute, second, and milliseconds of the object, using either local time or UTC (universal, or GMT) time. All dates are calculated in milliseconds from 01 January, 1970 00:00:00 Universal Time (UTC) with a day containing 86,400,000 milliseconds.

Set Dates We can easily manipulate the date by using the methods available for the Date object. In the example below we set a Date object to a specific date (14th January 2010): var myDate=new Date(); myDate.setFullYear(2010,1,14); And in the following example we set a Date object to be 5 days into the future: var myDate=new Date(); myDate.setDate(myDate.getDate()+5);

Date Object Properties Property Description constructor Returns the function that created the Date object's prototype prototype Allows you to add properties and methods to an object

Date Object Methods Method Description getDate() Returns the day of the month (from 1-31) getDay() Returns the day of the week (from 0-6) getFullYear() Returns the year (four digits) getHours() Returns the hour (from 0-23) getMilliseconds() Returns the milliseconds (from 0-999) getMinutes() Returns the minutes (from 0-59) getMonth() Returns the month (from 0-11) getSeconds() Returns the seconds (from 0-59) getTime() Returns the number of milliseconds since

Date Object Methods setDate() Sets the day of the month (from 1-31) setFullYear() Sets the year (four digits) setHours() Sets the hour (from 0-23) setMilliseconds() Sets the milliseconds (from 0-999) setMinutes() Set the minutes (from 0-59) setMonth() Sets the month (from 0-11) setSeconds() Sets the seconds (from 0-59) setTime() Sets a date and time by adding or subtracting a specified number of milliseconds to/from

JavaScript Math Object The Math object allows you to perform mathematical tasks The Math object includes several mathematical constants and methods. var pi_value=Math.PI; var sqrt_value=Math.sqrt(16); Math is not a constructor. All properties and methods of Math can be called by using Math as an object without creating it.

Mathematical Constants JavaScript provides eight mathematical constants that can be accessed from the Math object. These are: E, PI, square root of 2, square root of 1/2, natural log of 2, natural log of 10, base-2 log of E, and base-10 log of E.

Mathematical Constants Math.E Math.PI Math.SQRT2 Math.SQRT1_2 Math.LN2 Math.LN10 Math.LOG2E Math.LOG10E

Mathematical Methods In addition to the mathematical constants that can be accessed from the Math object there are also several methods available. The following example uses the round() method of the Math object to round a number to the nearest integer: document.write(Math.round(4.7));

Math Object Methods Method Description abs(x) Returns the absolute value of x acos(x) Returns the arccosine of x, in radians asin(x) Returns the arcsine of x, in radians atan(x) Returns the arctangent of x as a numeric value between -PI/2 and PI/2 radians atan2(y,x) Returns the arctangent of the quotient of its arguments ceil(x) Returns x, rounded upwards to the nearest integer cos(x) Returns the cosine of x (x is in radians) exp(x) Returns the value of Ex floor(x) Returns x, rounded downwards to the nearest integer

Math Object Methods log(x) Returns the natural logarithm (base E) of x max(x,y,z,...,n) Returns the number with the highest value min(x,y,z,...,n) Returns the number with the lowest value pow(x,y) Returns the value of x to the power of y random() Returns a random number between 0 and 1 round(x) Rounds x to the nearest integer sin(x) Returns the sine of x (x is in radians) sqrt(x) Returns the square root of x tan(x) Returns the tangent of an angle

FUNCTIONS IN JAVASCRIPT JavaScript provides several built-in functions that can be used to perform explicit type conversions. Example: The following results in the value 105 being assigned to the variable grand_Total. var grand_Total= eval(“l0 * 10 + 5”);

USER DEFINED FUNCTIONS Functions offer the ability to group together JavaScript program code that performs a specific task into a single unit that can be used repeatedly whenever required in a JavaScript program. A user defined function first needs to be declared and coded. Once this is done the function can be invoked by calling it using the name given to the function when it was declared.

Declaring Functions Functions are declared and created using the function keyword. A function can comprise of the following: A name for the function A list of parameters (arguments) A block of JavaScript code Syntax: function function_name(parameterl, parameter2, . . .) { /1 Block of JavaScript code }

A function_name is case sensitive, can include underscores and has to start with a letter. The list of parameters passed to the function appears in parentheses and commas separate members of the list. Note: Defining a function does not execute the JavaScript code that makes up the function.

Place of Declaration Functions can be declared anywhere within an HTML file. Preferably, functions are created within the <HEAD>...</HEAD> tags of the HTML file. This ensures that all functions will be parsed before they are invoked or called. If the function is called before it is declared and parsed, it will lead to an error condition, as the function has not been evaluated and the ‘Browser’ does not know that it exists.

Passing Parameters Values can be passed to function parameters when a ‘parameterized’ function is called. Values are passed to the function by listing them in the parentheses following the function name. Multiple values can be passed, separated by commas provided that the function has been coded to accept multiple parameters.

Function Declaration: function printName(user) { document.write(“<HR>Your Name is <B><l>”); document.write(user); document.write(”</B></l><HR>”); } where, printName is a function, which has a parameter called user. The parameter user can be passed a value at the time of invoking the function. Within the function, reference to user will then refer to the value passed to the function.

Function Call: A static value passed: printName(”Bob”); (will cause the string “Bob” to be assigned to the parameter user.) A Variable Passed: var user = “John”; printName(user); (will cause the value “John” to be assigned to the parameter user.)

<HTML> <HEAD> <TITLE>Creating and Using User Defined Functions</TITLE> <SCRIPT Language=”JavaScript”> var name =””; function hello() { name = prompt(’Enter Your Name:’, ‘Name’); alert(’Greetings ‘+ name +‘, Welcome to my page!’); } function goodbye() { alert(’Goodbye ‘ + name +‘, Sorry to see you go!’); } } <JSCRIPT> </HEAD> <BODY onLoad=hello(); onUnload=goodbye();> <1MG SRC=”images/Pinkwhit.gif’> </BODY> </HTML>

Variable Scope The parameters of a function are local to the function. They come into existence when the function is called and cease to exist when the function ends. For instance, in the example printName( ), user exists only within the function printName( ) - it cannot be referred to or manipulated outside the function. Also, any variable declared using var variable-name within the function would have a scope limited to the function.

Variable Scope If a variable is declared outside the body of the function, it is available to all statements within the JavaScript. If a local variable is declared within a function has the same name as an existing global variable, then within the function code, that variable .name will refer to the local variable and not the global variable. It is as though the global variable does not exist with respect to the JavaScript code within the function.

Return Values As with some JavaScript built-in functions, user defined functions can return values. Such values can be returned using the return statement. The return statement can be used to return any valid expression that evaluates to a single value. Example: function cube(number) { var cube = number * number * number; return cube; }

Recursive Functions Recursion refers to a situation, wherein functions call themselves. In other words, there is a call to specific function from within the same function. Such functions are known as Recursive Functions

example function factorial(number) { if(number> 1) { return number * factorial(number- 1); } else { return number; }

Recursive Functions Note: Recursive functions are powerful, but can lead to infinite recursions. Infinite recursions occur when the function is designed in such a way as to call itself without being able to stop.

PLACING TEXT IN A BROWSER Using JavaScript a string can be written to the browser from within an HTML file. The document object in JavaScript has a method for placing text in a browser. This method is called write ( ). Methods are called by combining the object name with the method name: Object-name. Method-Name

The write() method accepts a string value passed to it within its parentheses. The string value can then be written to the browser. The write( ) method accepts this string and places it in the current browser window. For example: document.write(”Test”); The string ‘Test” will be placed in the browser.

Events A mouse click A web page or an image loading Mousing over a hot spot on the web page Selecting an input field in an HTML form Submitting an HTML form A keystroke

onLoad and onUnload The onLoad and onUnload events are triggered when the user enters or leaves the page. Both the onLoad and onUnload events are also often used to deal with cookies that should be set when a user enters or leaves a page.

onFocus, and onChange The onFocus, onBlur and onChange events are often used in combination with validation of form fields.

onSubmit The onSubmit event is used to validate ALL form fields before submitting it. Below is an example of how to use the onSubmit event.

onMouseOver and onMouseOut onMouseOver and onMouseOut are often used to create "animated" buttons. Below is an example of an onMouseOver event.