JavaScript Objects

This section does not describe the handling of objects in JavaScript since it is assumed the reader possesses object oriented knowledge. It provides information about the creation of JavaScript objects, templates, constructors, and more.

Object Creation

Generally objects may be created using the following syntax:

name = new Object()

For instance Array, Date, Number, Boolean, and String objects can be created this way as in the example below. Most objects may be created this way except for the Math object which cannot be instantiated (an instance of it may not be created).

ratings = new Array(6,9,8,4,5,7,8,10)
var home = new String("Residence")
var futdate = new Date()
var num1 = new Number()

String objects may also be created as follows:

var string = "This is a test."

Object Template

Objects are created using templates. Templates to objects are like cookie cutters to cookies. Cookie cutters are used to create instances of cookies and object templates are used to create instances of objects. For now, the template is shown. The following creates an object, olist.

function olist(elements)
{
   this.elements = elements
   this.listitems = new Array(elements)
   this.getItem = list_getItem
   this.setItem = list_setItem
}

The methods list_setItem and list_getItem are written as follows:

function list_getItem(element)
{
   return this.listitems(element)
}

function list_setItem(element, stringval)
{
   this.listitems(element) - stringval
}

Creating the Object

var list1 = new olist(10)

Changing the Object

list1.setItem(0,"This is the first item in the list")
list1.setItem(1,"This is the second item in the list")
list1.setItem(2,"This is the third item in the list")

The Prototype property

The prototype property can be used to create new properties of created objects (whether they are user defined or system defined) as follows:

list1.prototype.type = "1"

The Function Constructor

Creation:

minus2 = new Function("x","return x-2")

Usage:

y = minus2(10)

The value of y is now 8.

Object use

When writing JavaScript, you are embedding the JavaScript in an object. These objects may have functions. An example function is the alert() function. It may be called as follows:

alert("An error occurred!")

However, the window object is the highest level JavaScript object, therefore the following code does the same thing:

window.alert("An error occurred!")

The following code using the "this" object declaration will perform the same:

this.alert("An error occurred!")

Object and Property Reference

Objects and their properties are normally referenced using a dot between each object or its property or method. as follows:

document.write("This is a test.")

However, a method called array notation, may be used. Array notation is required when the first character of a property name is a digit since the dot method may not be used in this case. The above example in array notation is:

document ["write"] ("This is a test.")

Levels of Objects

JavaScript has basically three types of objects which are:

Top level objects
Objects that are properties of other objects
Objects that are not properties of other objects

Hierarchy Objects
Object	Properties	Methods	Event Handlers
Window	defaultStatus frames opener parent scroll self status top window	alert blur close confirm focus open prompt clearTimeout setTimeout	onLoad onUnload onBlur onFocus
Frame	defaultStatus frames opener parent scroll self status top window	alert blur close confirm focus open prompt clearTimeout setTimeout	none (The onLoad and onUnload event handlers belong to the Window object)
Location	hash host hostname href pathname por protocol search	reload replace	none
History	length forward go	back	none
Navigator	appCodeName appName appVersion mimeTypes plugins userAgent	javaEnabled	none
document	alinkColor anchors applets area bgColor cookie fgColor forms images lastModified linkColor links location referrer title vlinkColor	clear close open write writeln	none (the onLoad and onUnload event handlers belong to the Window object.
image	border complete height hspace lowsrc name src vspace width	none	none
form	action elements encoding FileUpload method name target	submit reset	onSubmit onReset
text	defaultValue name type value	focus blur select	onBlur onCharge onFocus onSelect

Built-in Objects
Array	length	join reverse sort xx	none
Date	none	getDate getDay getHours getMinutes getMonth getSeconds getTime getTimeZoneoffset getYear parse prototype setDate setHours setMinutes setMonth setSeconds setTime setYear toGMTString toLocaleString UTC	none
String	length prototype	anchor big blink bold charAt fixed fontColor fontSize indexOf italics lastIndexOf link small split strike sub substring sup toLowerCase toUpperCase	Window

RICH INTERNET APPLICATIONS UNIT 2

Pages

Friday, September 24, 2010