I’ve always found JavaScript’s approach(es) to OOP a little cumbersome. I’m not talking here about prototypal vs. class-based OOP. Rather, I’m talking about the readability, etc. of the actual code you have to write to build objects. I want to take a few blog entries to try to put the maze into some kind of cohesive perspective.
I like to use a tally clicker to explore objects in languages I am learning. A tally clicker is a real-world object with a minimal set of features that are easy to implement and that map to basic but salient OOP concepts.
Object literals
I’m going to start this exploration with plain-Jane object literals. This is one of the canonical ways and often the first way shown to implement objects in JavaScript. Here’s how I might implement a tally clicker with a JavaScript literal:
// == Create a tally clicker ======== var myClicker = { // pseudo-private property _numClicks: 0, // pseudo-private method _update: function() { console.log("myClicker1: " + this._numClicks); }, // public methods click: function() { this._numClicks++; this._update(); }, reset: function() { this._numClicks = 0; this._update(); }, showInfo: function() { alert('I am "myClicker" and am at ' + this._numClicks + ' clicks.'); } }; // == End tally clicker ========
I might then stick something like this into the HTML:
<button onclick="myClicker.click();">Click</button> <button onclick="myClicker.reset();">Reset</button> <button onclick="myClicker.showInfo();">Info</button>
The object literal approach is a seductively easy and pretty readable way to build an object—but it’s got issues. Namely:
- There’s no automatic initialization apart from property values.
- It violates encapsulation because everything is public.*
- It pollutes the global namespace (sort of). As is, the name of the object is in the global namespace.
- The object abstraction doesn’t scream, “Reuse me!” (This may be a cognitive style issue more than anything else.)
In the next couple installments, I’ll consider some alternative implementations specifically with regard to the above criteria. For the moment, I will not deal with:
- Inheritance-like stuff
- “Class” (i.e., static) members*
- Polymorphism
*An issue of religious importance.
One thought on “(Over)thinking JavaScript objects 1”