Object oriented programming
Objects
An object is a 'thing'. For example a number is an object. An array is an object. Your browser window is an object. A form in your document is an object. There are hundreds more, and in some cases you can create your own.
Objects can have objects in them. For example, your document can have a form in it. This form is a
'child object' of the document. Therefore the document is the 'parent object' of the form. To reference
the child object, we have to go through the parent object, eg. document.myForm
An array can have numbers in its cells. As we have already discussed, the array is an object, and so
would be a cell within it, and so is the content of the cell. We cannot refer to the cell itself, but
we can refer to its contents: myArray['cell name or number'] for example.
Classes (or types)
A class is a group of objects that are similar in some way. For example, a number and a piece of text can both be stored as a variable (in a way, like the variables you would use in mathematical algebra). In essence, we can say that pieces of text and numbers are examples of class 'variable'.
Numbers can be sub divided into two groups, integers and floats (or doubles). Integers are whole numbers: 1, 2, 3, 4, 0, -1, -2, etc. Floats have decimal points: 1.1, -5.7, 0.5, etc. In this case, we can say that 3 is an instance of class variable, (sub)class number, (sub)class integer.
In fact, a variable is a type of object. All instances of class 'object' have a certain two methods: toString() and valueOf(). Therefore, as 3 is an instance of class object, (sub)class variable, (sub)class number, (sub)class integer, it will inherit the toString() and valueOf() methods provided by the class 'object'.
Classes are not so important in JavaScript as they are in many other object oriented programming languages. Classes can be created when you define your own classes of objects, but it is not usual to create your own 'sub'-classes.
Collections
If you need to know what arrays are, see the section on Variables.
There are many arrays that are inbuilt into each document. The document itself is an array in certain uses.
The most obvious of these collections is the images collection. To refer to images in the document, we use
document.images['name of image']
This is a special kind of array, known as a collection.
Properties
Take, for example, an image. When we define images in HTML, we write:
<img src="frog.gif" name="myImage" height="10" width="10" alt="A frog">The properties of the image would be src, name, height, width, alt and if we also used Style Sheets we might
have included several more (like background-color for example). All properties are a type of object so to
refer to the src of my image, I would write document.images['myImage'].src
Methods
There are always actions that are associated with objects. For example, a form may be submitted or reset. The
actions are methods. To submit a form in non-object-oriented programs, we might write
submit('name of form')
That would simply be a function. In object oriented programming like JavaScript, we would use
document.nameOfForm.submit()
The reason this is a method and not just a function is that each form will have its own submit() function built in, which is referred to using the object oriented syntax shown above. You will never have to write methods in yourself unless you create your own objects, the browser does that for you.
You can think of it like this:
- With the non-object-oriented way, we would tell a function to submit the form.
- With the object oriented way, we would tell the form to submit itself.
If wanted, you can run several methods in turn on the same object by using:
referenceToTheObject.method1().method2().method3().method1again()In this case, method1 must return a class of object that has the method 'method2' etc.
Last modified: 21 March 2009