Tuesday, May 19, 2015

Readable jquery

I'm doing some JQuery stuff and for a person of simple tastes the readability of nested function() definitions all written on one line is very poor. Debugging is a pain in the arse. So here's some modest proposals for maintanable code:

  • Assign callback functions to variables
  • Use the variable in place of the function (){...}
  • Format them as you would if it was a function with all the relevant curly braces and indents
This adds a few characters of 'weight' to the page, but these can be minified away for production code.  

Here's how I would do it:


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

var showmess="Show";
var hidemess="Hide";
var show=function()



<p>You can't see this</p>

But you can see this.

<a href="#" id="showlink">&nbsp;</a>

As you can see I'm a bit of a traditionalist with my curly braces. My training manual when I started c programming was K&R C Programming Language and I've never really got out of the habit of matching brace indents.

No comments:

Post a Comment