• Choose a category
• All
• Classic-Fiction

By Root 1602 0

attitude quite strange and maybe a bit sloppy. Other languages do have a lot more rules about how objects are made and used, but JavaScript’s approach has its charms. Don’t get too tied up in the differences. The way JavaScript handles objects is powerful and refreshing.

Adding methods to an object

Objects have other characteristics besides properties. They can also have methods. A method is simply a function attached to an object. To see what I’m talking about, take a look at this example:

//create the critter

//from addingMethods.html

var critter = new Object();

//add some properties

critter.name = “Milo”;

critter.age = 5;

//create a method

critter.talk = function(){

msg = “Hi! My name is “ + this.name;

msg += “ and I’m “ + this.age;

alert(msg);

}; // end method

// call the talk method

critter.talk();

This example extends the critter object described in the last section. In addition to properties, the new critter has a talk() method. If a property describes a characteristic of an object, a method describes something the object can do. Figure 4-9 illustrates the critter showing off its talk() method:

Figure 4-9: Now the critter can talk!

Here’s how it works:

1. Build an object with whatever properties you need.

Begin by building an object and giving it some properties.

2. Define a method much like a property.

In fact, methods are properties in JavaScript, but don’t worry too much about that; it’ll make your head explode.

3. You can assign a prebuilt function to a method.

If you created a function that you want to use as a method, you can simply assign it.

4. You can also create an anonymous function.

More often, you’ll want to create your method right away. You can create a function immediately with the function(){ syntax.

5. The this keyword refers to the current object.

Inside the function, you may want to access the properties of the object. this.name refers to the name property of the current object.

6. You can then refer to the method directly.

After you define an object with a method, you can invoke it. For example, if the critter object has a talk method, use critter.talk() to invoke this method.

Building a reusable object

These objects are nice, but what if you want to build several objects with the same definition? JavaScript supports an idea called a constructor, which allows you to define an object pattern and reuse it.

Here’s an example:

//building a constructor

//from constructor.html

function Critter(lName, lAge){

this.name = lName;

this.age = lAge;

this.talk = function(){

msg = “Hi! My name is “ + this.name;

msg += “ and I’m “ + this.age;

alert(msg);

} // end talk method

} // end Critter class def

function main(){

//build two critters

critterA = new Critter(“Alpha”, 1);

critterB = new Critter(“Beta”, 2);

critterB.name = “Charlie”;

critterB.age = 3;

//have ‘em talk

critterA.talk();

critterB.talk();

} // end main

main();

This example involves creating a class (a pattern for generating objects) and reusing that definition to build two different critters. First, look over how the class definition works:

♦ Build an ordinary function: JavaScript classes are defined as extensions of a function. The function name will also be the class name. Note that the name of a class function normally begins with an uppercase letter. When a function is used in this way to describe an object, the function is called the object’s constructor. The constructor can take parameters if you wish, but it normally does not return any values. In my particular example, I add parameters for name and age.

♦ Use this to define properties: Add any properties you want to include, including default values. Note that you can change the values of these later if you wish. Each property should begin with this and a period. If you want your object to have a color property, you’d say something like this.color = “blue”. My example uses the local parameters to define the properties. This is a very common