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 later.

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.