Objects with Values in JavaScript
Written by Ian Elliot   
Monday, 29 August 2011
Article Index
Objects with Values in JavaScript
Using factory objects and constructors

Sometimes it is useful for an object to have a default value so that it can be used in an expression such as object+1 and object+"hello world". In JavaScript this is really easy.


Banner

 

Sometimes it is good for an object to have a value, or even more than one value. For example, suppose you have an object that represents an item in an order. The object may have a number of additional properties and methods.

For example:

item.name="widget";
item.tax=0.1;
item.price=10;

However if you consider the primary property of an item to be its price you might want to write expressions such as:

totalcost=item1+item2;

to mean

totalcost=item1.price+item2.price;

Similarly you might consider the item's name to be its primary string property and you might want to write statements like:

alert(item);

to mean

alert(item.name);

You might argue that this isn't a good example of using default values and that it would be better to use the full property names. However, there are examples where it is natural for the values stored in an object to take part in arithmetic, logical or string expressions and in these cases not to have the ability to define default values.

For example the JavaScript Date object returns the date as the number of milliseconds from the start date when used as if it was a number and a formatted date string when used as a string. In fact this article was suggested by some work I was doing on adding a TimeInterval object to JavaScript and in this case it was natural for the object to have default value properties.

So how do you define a default value?

The answer is surprisingly simple.

When an object is involved in an expression the valueOf method is called which returns a numeric or Boolean value. The numeric or Boolean value is further type converted to make the expression work. If the object is part of an expression where a string would be required then toString is called.

So far this is nothing new and it just gives rise to the type conversion rules that you should know about. However you can define your own valueOf and toString methods and these can be used to deliver custom default values.

Let's see how this works.

A singleton example

To implement the previous example of an item object with properties name, tax, price as a singleton or object literal you would use:

var item = {
name: "",
tax: 0,
price: 0,

and to make price the default numeric property and name the default string property you would define two methods:

valueOf: function(){
return item.price;
},
toString: function(){
return item.name;
}
}

The complete object is:

var item = {
name: "",
tax: 0,
price: 0,
valueOf: function(){
return item.price;
},
toString: function(){
return item.name;
}
}

If you don't like or aren't familiar with this way of creating an object you can use:

var item={};
item.name="";
item.tax=0;
item.price=0;
item.valueOf = function(){
return item.price;
};    
item.toString = function(){
return item.name;
};

Now if we set some values in the properties and try to use item in an expression you will find that the valueOf and toString are called as defined earlier:

item.name = "widget";
item.tax = 0.1;
item.price = 10;
alert(0 + item);
alert(item);

The first alert has an arithmetic expression which expects item to be a numeric value so valueOf is called and the result is 0+10 i.e. 10. Notice that as alert expects a string value as its parameter JavaScript kindly converts numeric 10 into a string. In the second alert the item parameter is supposed to be a string and so toString is called which returns the name and so widget is displayed.

 

Banner

<ASIN:0596517742>
<ASIN:0596805527>
<ASIN:0470684143>



Last Updated ( Friday, 18 November 2011 )
 
 

   
RSS feed of all content
I Programmer - full contents
Copyright © 2014 i-programmer.info. All Rights Reserved.
Joomla! is Free Software released under the GNU/GPL License.