We’ve already gone through the basic JavaScript concepts we need to write object oriented code, and we’ve already seen the basic pattern. But here’s a couple of tips that has proven useful many times when writing long and complex JavaScript code.

The curious case of the mutating scope

Ok, now imagine we have some fancy widget in our class and we want to interact with it. There are many widgets which redefine the this keyword to its instance instead of ours. For this case, we might want to be able to access our instance instead of the widget instance. We’ll need to redefine the scope in which the function is being executed. To do so, we can use the following function:

// Creates a new function and returns a reference. This new function has its scope set to 'newScope'
this.setScope = function (originalFn, newScope) {
   return function () { return originalFn.apply(newScope, arguments); };
};

We could just use the apply method on our original function, but I prefer this way since its more comfortable to work with parameters like this.

Be careful when using this, since this is a double-edged sword. By accessing our class scope we have all our data available. But we won’t have the widget’s scope available anymore. So make sure you don’t need to access the widget’s scope before changing the scope of the event handler.

Read the rest of this entry »

Ok, now that we’ve covered the most basic concepts of JavaScript, we can now proceed to take a look at the pattern itself.

The first feature we need to implement is private and public members. Using closures, this is easy to achieve:

Read the rest of this entry »

Today’s web applications are inconceivable without the use of JavaScript. It has become a fundamental part in modern web systems. A lot of time and effort must be put into client-side programming to make our application have that modern look & feel that JavaScript provides and we all like to see.

Until AJAX techniques emerged, JavaScript was not seen as an application development platform. It was treated merely as a scripting language to implement minimal dynamic web page behavior. Up till not too long ago, all the JavaScript I needed to write was just a few lines of code to make some validations, a few animations and some AJAX calls… but this has definitely changed today. The number of JavaScript lines I am writing nowadays for the web apps I’m developing are counted in the thousands. Heck, the last module I developed at work contained more than 12000 lines of JavaScript code! This means that I can no longer just write code without order. I need to have some logic behind the process of writing code. And this is when object oriented techniques come into play.

Read the rest of this entry »