OO Programming with JavaScript

I came from an OO world. When I started coding with JavaScript, I always struggled with losing the techniques we used in OO programming to reduce code duplicates. Examples are we can easily use composition and inheritance in OO to make code reuse. Here is something I figure might be useful for people  migrating from OO world into JavaScript.

Basically, I want to use simple features in JavaScript to simulate the structures in the OO world: composition and inheritance. The result is actually very simple.

function myClassCtor (ctorParams)
{
var inner = {};
inner.privateData = ctorParams; // or something similar
inner.privateFunction = function(functionParams)
{
// function body
};

var outer = {};
outer.publicFunction = function (funcParams)
{
//function body
};
return outer;
};

This is the basic shape of a "class". Everything attached to the "inner" object is equivalent to your private section of the code and everything attached to the "outer" object is equivalent to your public section. I picked the word "inner" and "outer" since "public" and "private" seem to be reserved words (that's what DevStudio is telling me :-). In JavaScript every function is by nature "virtual", you just provide another function body to override.

If you need to inherit public functions from another class, you only need to change the way outer is constructed.

var outer = baseClass(ctorParams);

If you need to use functions from another class by composition, you have several ways of doing it

• construct them on the stack in the constructor
• construct them as a data member of "inner"
• construct them as inner, i.e.var inner=composition(ctorParams);

When you realize a function is reusable from your private section, you can simply move the function to public section of a base class for your "inner" and construct your "inner" with the base class just introduced. The rest of your code doesn't change.

Similarly, when you realize a public function can be reused, you can migrate to a base class for your "outer".

You may also have "protected" section if you like.

var based = {};
based.data = sharedSecret;
based.protectedFunction = function(params)
{
//function body
};

var outer = baseClass(based);

and in your base class

function baseClass(based)
{
var inner = {};
inner.shared = based;
var outer = {};

outer.publicFunction = function()
{
// function body
inner.shared.protectedFunction(params); // call "protected" function
};
};


The part I like the most about this approach is you don't see "this" anywhere. In the early time of my JavaScript coding, figuring out what "this" is was the most painful part for me. Now you don't have to worry about it anymore.