CodeSOD: Three Links

Brian's hired a contractor to tackle a challenging technical problem: they wanted to display three links in three table cells. Now, you or I might just write that as HTML. But if we did that, we'd lose the opportunity to do this in JavaScript. Plus think of all that repetition- you'll be outputting a <td></td> tag pair three times. That's just wasteful.

No, what we need is some elegant JavaScript solution that solves this problem without any unnecessary repetition.

for(i = 0; i < 3; i++){link += '<tr>';link += '<td class=\'CopyRightInfo\' style=\'text-align: left; cursor: pointer; color: #000000;\'>';if(i == 0){link += '<a href=\'#\' onclick=\'javascript:window.open(\"https://www.somesite.com/");\' >Login</a>';}else if(i == 1){link +='<a href=\'/Address/Configure.aspx\' >Configure</a>'; }else if(i == 2){link +='<a href=\'#\' onclick=\'javascript:window.open(\"https://signup.someothersite.com/\");\'>Sign Up</a>'; }link += '</td>';link += '<tr>';}

Here we employ the For-Case antipattern to write a loop where we do something different on each iteration. That's a classic WTF, but here it's elevated through how unnecessary all of this really is. Plus we get the bonuses of style overrides, and the number of escaped quotes- but inconsistently and needlessly so. Take a look at the i == 0 branch- the double quote doesn't need to be escaped, and one time it isn't.

Suffice to say, this contractor's code wasn't used, and neither was that contractor after this.

[Advertisement] Otter - Provision your servers automatically without ever needing to log-in to a command prompt. Get started today!