Using Object-Oriented JavaScript to Create Multi-Use Tabs

Taking JavaScript More Seriously

As I migrated from basic HTML to JSPs and finally complex Server-Side Java, I became less and less respectful of client-side languages, and most of my colleagues were pretty much in lockstep with me. While working in the view layer, adding JavaScript was a tedious necessity, and most programmers I worked with built well-made, but structural, scripts to handle the needs of the page.  They knew what they wanted it to accomplish and they just wrote it to “do that thing”.  It “wasn’t worth” digging deep into it, because it is just “throw away” code that the view used; not really worthy of Server-Side Programmers’ attention.

Using a prototype to extend your JavaScript methods.

The Problem: Calling a function many times throughout a particular JavaScript file or block.

JavaScript is often used to manipulate a variety of HTML objects on a page, i.e. to “show” or “hide” them, or perform some type of toggled functionality on a variety of buttons, divs, etc. It is not uncommon to see code like this littered in a variety of places throughout a typical large Script block:

if(foo == bar){

document.getElementById("blah").style.visibility="block";

document.getElementById("blue).style.visibility="none";

document.getElementById("red").style.visibility="block";

document.getElementById("black").style.visibility="none";

}

Implementing the above in numerous places throughout said block of Script with a couple of hundred lines can eat up a lot of space, be harder than all get out to maintain, and if the guy that wrote it gets hit by a bus, you can often watch the next engineer in line cry for days in front of their screen just trying to figure out what the original coder was thinking when they wrote it.