ChunkySoup.net Serving hearty nuggets since 2001

Intro to Object Oriented JavaScript

The purpose of this article is to introduce the reader to Object Oriented JavaScript both in concept and in application. The reader is expected to already have experience with both HTML and JavaScript. This is the first of two articles on the topic and covers the concept of OOP, encapsulation, and application in JavaScript. I plan on covering inheritance and reuse more thoroughly in a later article. It impossible to do justice to every facet of Object Oriented Programming, so I won't even try. Instead I will explain the concepts only enough to model and code some simple custom JavaScript objects and use them in the real world.

What does it mean to be Object Oriented?

Object Oriented Programming is a style of coding based on the premise that every element in a system is an object. Each object in the system is made up of data fields (variables) and methods. The first step in programming any object oriented application is to model the elements in the system and their interaction with each other.

The primary benefits of coding in an object oriented manner and its inherit modularity include increased code reuse, easier maintenance and increased extensibility. Some of these are lost when dealing with JavaScript to do client side DHTML, but many are actually enhanced — take the common need to provide support for another buggy browser. But folks can and will argue the benefits of one style of programming over another until the cows come home, so I'll assume that since you are here reading this article you're at least interested enough in OOP to give it a shot.

As far as Object Oriented JavaScript is concerned there are two important concepts that should be learned:

Encapsulation
Encapsulation is the idea that there is a lot of information and process that doesn't need to be known outside of the domain of an object itself. Other members of a system may need to the outcome of a process, or a specific piece of information, but rarely are they concerned with every detail. Walk into a diner and order a cup of coffee. There may be brewed coffee waiting in a pot, there may be 2 pots. There may be none left and some more has to be brewed on the spot. The cup and saucer might come off a shelf, or hot out of the washer. None of that ultimately matters to you as long as you get your cup of hot coffee, and its not decaf.
Inheritance
Inheritance is one way in which OOP takes into account the similarities between objects. For example, no one would look at a Nissan Sentra and Humvee parked next to each other and think they were the same vehicle. In designing the system to handle vehicles one might create a base AUTOMOBILE class. Then, to handle the differences between different car models, they would make many other classes like CAR, SUV and MINIVAN that would inherit the characteristics of the base class AUTOMOBILE, but provide some additional functionality. The relationship between these classes is commonly referred to as an IS-A relationship.

There are other great concepts in object oriented programming like polymorphism and exception handling, but I don't think I can fit them into the short introductory tutorial I'm trying to make this.