WbWizard's JS Book




Blue Line


Lesson 15: Object


Today we will discuss the basis for object oriented programming, the Object itself. An object is a collection of pieces of data referred to as properties of the object. If a function is stored as the value of one of these properties, it is referred to as a method of the object. Hence, properties are values while methods are built in functions or groups of scripts (either built into core JavaScript, or defined by the script author). For example, we have already discussed the document object, you can access the value of the bgColor property of this object to get the background color of the page using document.bgColor to reference it, and you can write text to the document by passing arguments to the function referenced by the write() method using document.write('Text')

Think of properties as variables and methods as functions for the least confusion.

1) Accessing Object Properties and Methods

A) . operator
When using the . operator, you are restricted to using an object on the left and a property or method name on the right. You must use the literal property/method name, no dynamically generated strings can be used with the . operator! Example:

good = document.location
bad   = document."location"

B) [] operator
When using the [] operator, you are not limited to only a literal property name in the brackets, but can use either strings enclosed in quotes (associative arrays) or numerical values depending upon the referenced values held by the object on the left, allowing access to dynamically generated objects and their properties and or methods. Examples:

Arrays- Object.n
frames[n]
document.forms[n]

[Note- n can be an integer or an expression that evaluates to an integer, or a string as needed]

Objects- Object['Property_Name_String']
frames['Frame_Name']
document['lastModified']

2) Creating New Objects
A) The new Operator

You can create an entirely new object in JavaScript through the use of the new constructor. For example, the time is a constantly changing bit of data, and the only way to access it is to freeze a moment of it by creating a new instance of the Date() object. Example: var now=new Date();

Once created, you can access the properties or methods of now just as any other Date object. Example:

var hour=now.getHours();

You can create an entirely new object and define properties for it as well. Example:

var o=new Object();
o.something='whatever';
o.someother=new Function('x','return x++;');

Which could then be referenced such as:
alert(o.something);
var increase=o.someother(n);

[Note- n=any integer or string as the function demands]

3) Object Classes

New objects are created as members of a class of objects who inherit certain predefined properties from their class. For example, a rectangle object would have height and width properties, and any rectangle object created dynamically would inherit these properties (but not their values of course). Example:

This will create a Rectangle class of objects:
function Rectangle(w,h){
this.width=w;
this.height=h;
}
var myRectangle=new Rectangle(2,6);

You could use any number of means to generate the new objects once their class is defined, allowing you to write full feature programs which dynamically create new usable objects and classes as needed.



Easy Pad



Blue Line
Lessons by
Jerry aka WebWizard