Search within TutorialsPark

Javascript Best Practices : Maintaining Code


Learn the Best Practices for Writing Easily Maintainable Code.


Javascript Best Practices: Code Maintainability

Internet was grown exponentialy over the years, small websites with a few simple webpages have grown to complex web application with Thousands of lines of JavaScript Code.

Which such large increase in size and scale of the code, Maintainability of the code is as important as writing it, as multiple developers must be working on the same project and must be able to understand each others work and maintain it.


How to Write Maintainable Code?

Easy to Understand : Your Code must be easy to understand, such that other can pick up from where you left. This could involve commenting you codes, spacing the codes well.

Makes Sense : Your code must make sense for even the most complex solutions.

Easy To Adapt : Code should be easily adpatable and scaleable, such that small changes in data or functionality won't require a complete rewrite.

Easy To Scale Up : The architecture of the code must be in a form such that the core functionality can easily be scaled up without having to rewrite it.

Easy To Debug : The code should be able to provide information as to what went wrong, thus aiding the error handling.

For a professional web developer, the ability to write maintainale code is a must,since a web developers many a times have to work on extend and maintaining existing applications.


Code Maintainablity Convention: Readability

Indentation : The most basic aspect of maintainable code is the Readability of the code, for the code to read easily the indentation (empty space at the beginning of a line) must be appropriate.

Comments : Another aspect to enhancing code readability is to comment on them, parts of the code which should have associated comments are:

Functions & Methods : Comments should describe the purpose and(or) the algorithm used, the arguments used, return value etc.

Algorithms : Workings of some complex algorithm must be explained using comments, this helps other developers to maintain and extend the code from where others left.


Code Maintainablity Convention: Naming and Comments

1. Another important aspect of creating maintainable code is to use appropriate names for functions, variables methods etc.Names should make sense and should be related to the nature of the problem.

2. Names of functions must start with a verb, eg: setValue() , function working with Boolean values usually start with is, as in isDisabled() .

3. Name of variables and functions must be logically related to the program, even when the length of the names have a larger length. Names that are unrelated and one's that do not make sense should be avoided.

4. All Variables should be initializied to a value at the time of creation.Eg : for boolean values true

5. Hungarian notations format which prepends a single character for basic datatypes can be used as well. Eg: "o" for objects , "s" for strings etc.

5. Another innovative way is to specify the variable type in the comments, they should be placed right after the variable name and before its initialization.

Example: Javascript Maintainability Conventions : Comments.


Javascript Maintainability Conventions: Loosely Coupled Code

1. The architecture of the code should not be monolithic or very tighly coupled, the dependence of one component of the code on another must not be too heavy, since a change in one component affects all others.

2. On a Webpage, HTML and JavaScript represet different layers of code, the HTML code contains the data on the webpage, while JavaScript defines the behaviour of the webpage.

3. On a Webpage, JavaScript and HTML codes interact with each other but must be kept as seperate as possible. The same must be applicable to CSS/JavaScript and HTML/CSS as well.

Example: JavaScript Maintainability : Loosely Coupled Code


Javascript Code Conventions: Avoiding Global Lookups

Another convention to be used while programming is to to avoid global variables and function as much as possible, since more cpu cyles are required to refer to a global variable every time.

In order to throw a custom error use the function throwIt(), it checks for a condition to be true, and if the condition is false an error is thrown.

Example: JavaScript Conventions : Avoiding Global Lookups