Home arrow JavaScript arrow Page 6 - An Object Lesson In JavaScript

Turning Up The Heat - JavaScript

Think JavaScript is only good for image swaps and flying <div>s?Think again - this article takes an in-depth look at some of theobject-oriented constructs available in JavaScript, and demonstrates howJavaScript objects can substantially speed up code development anddeployment.

  1. An Object Lesson In JavaScript
  2. Object Lessons
  3. Sumthing New
  4. Alpha Radiation
  5. Add()ing Some More
  6. Turning Up The Heat
  7. Room With A View
  8. Construction Crew
  9. A Hot Date
By: Vikram Vaswani, (c) Melonfire
Rating: starstarstarstarstar / 23
April 02, 2001

print this article


Here's another example, this one a Thermometer object which allows you to convert between different temperature scales.

<script language="JavaScript">
// constructor
function Thermometer(degrees, scale)
// methods
this.convertToCelsius = convertToCelsius;
this.convertToFahrenheit = convertToFahrenheit;
this.raiseTemp = raiseTemp;
// action to take
if (scale == "f" || scale == "F")
this.scale = scale;
this.degreesF = degrees;
this.degreesC = 0;
this.scale = scale;
this.degreesF = 0;
this.degreesC = degrees;
// conversion functions
function convertToCelsius()
this.degreesC = (5.0/9.0) * (this.degreesF - 32.0);
function convertToFahrenheit()
this.degreesF = ((9.0/5.0) * this.degreesC) + 32.0;
// method to raise temperature
function raiseTemp(num)
this.degreesF += num;
this.degreesC += num;

Nothing too fancy here - the constructor simply creates an object, initializes it with a temperature and temperature scale, and runs a conversion function to obtain the equivalent temperature in the other scale. A raiseTemp() method is included to demonstrate how object properties can be altered.

It should be noted here that it is also possible to directly adjust the object properties without using the raiseTemp() method. I say "technically", because it is generally not advisable to do this, as it would violate the integrity of the object; the preferred method is always to use the methods exposed by the object to change object properties. By limiting yourself to exposed methods, you are provided with a level of protection which ensures that changes in the object constructor code do not have repercussions on your code.

And here's how you could use the object in an HTML document.
<script language="JavaScript">
// create an object instance
a = new Thermometer(98.6, "f");
// access object properties
alert("Temperature in Fahrenheit is " + a.degreesF);
alert("Temperature in Celsius is " + a.degreesC);
// execute object methods
alert("Temperature in Fahrenheit is " + a.degreesF);
alert("Temperature in Celsius is " + a.degreesC);

Here's the result:

>>> More JavaScript Articles          >>> More By Vikram Vaswani, (c) Melonfire

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort


- Javascript for Beginners: An Introduction
- Introduction to JavaScript
- Adding Elements to a Tree with TreeView jQue...
- Using the Persist Argument in a TreeView jQu...
- Using Unique and Toggle in a TreeView jQuery...
- Using Event Delegation for Mouseover Events ...
- Using the Animate Option in a Treeview jQuer...
- Using HTML Lists with Event Delegation in Ja...
- Opened and Closed Branches on a TreeView jQu...
- Mouseover Events and Event Delegation in Jav...
- Creating a TreeView JQuery Hierarchical Navi...
- Event Delegation in JavaScript
- A Look at the New YUI Carousel Control
- Working with Draggable Elements and Transpar...
- Displaying Pinned Handles with Resizable Con...

Developer Shed Affiliates


Dev Shed Tutorial Topics: