While most of the popular languages (Java, .NET, C++) have elaborate documents on the naming conventions to follow, I couldn’t find any such good document for javascript. All I could find was bits and pieces here and there. This is the main reason why I am creating this page listing the javascript naming conventions I follow. This may not be complete but I shall try to make it as comprehensive as possible.
1. All variables should be prefixed with a letter indicating the data type of the variable (Hungarian notation). These would be as below:
s – String
n – number
b – boolean
a – Array
o – object (Native Objects, Host Objects and user-defined objects)
Further, the first letter of each of the words should be capitalized.
Ex:
var sSampleText = "Hello";
2. Apart from this a letter indicating the scope of the variable should also be prefixed. This will help in differentiating the local variables from the global variables.
g – global
m – All member variables (private and public)
Ex:
var gsSampleText = "Hello";
3. Further all private member variables and methods of classes should be prefixed with _ to distinguish them from public member variables (Please note that the arguments of a constructor and all the variables initialized inside the constructor are actually private members of the object).
Ex:
function Person(_msFirstName, _msLastName)
{
this.msFirstName = _msFirstName;
this.msLastName = _msLastName;
}
4. All class names should be a combination of words with the first letter of each word capitalized.
Ex:
function XmlParser()
{
// Do something
}
5. The function names and method names should also be a combination of words with the first letter of each word capitalized except for the first word. Function and method names should generally indicate the action they are meant to perform. It is a very common practice to begin functions with get/set/is word depending upon whether the function is returning a value, setting a value or returning a boolean result.
Ex:
function Animal(_mnAge)
{
this.getAge =
function()
{
return _mnAge;
}
this.setAge =
function(nAge)
{
_mnAge = nAge;
}
this.isAgeValid =
function()
{
if (_mnAge < 0)
{
return false;
}
return true;
}
}
function doSomething()
{
// Do something
}
Apart from the above mentioned naming conventions, I also follow the below coding practices.
1. All statements should end with a semicolon.
2. Comments should be used properly. Every function and method should being with a comment indicating the action to be performed by it. Every logic should be commented properly.
3. Use single quotes for javascript literals and doubles quotes for HTML element attribute values. While this is not reallly necessary it makes it easy and consistent to write javascript code in-place within event handlers as well as html text in javascript code.
Ex:
HTML snippet: <a href="http://www.google.com" onclick="alert('You will be redirected to Google');" />
Javacript snippet: divElement.innerHTML = '<input type="text" name="age" id="age"/>';
4. For inline javascript (no need for js written in external file), make sure it does not cause a problem when validating the page for XHTML compliance. This can be achieved by writing the javascript code as shown below.
<script type="text/javascript">
//<![CDATA[
/* Your javascript code -- variables, functions,
classes and everything else */
//]]>
As far as I remember, this also hides the javascript code from old browsers.
6. Follow proper indentation
Indentation should be consistent. Use an indentation length of 2 or 4 spaces.
Ex:
if (sAge != null)
{
if (!isNaN(sAge))
{
if (parseInt(sAge) > 0)
{
return parseInt(sAge);
}
}
}
References:
http://www.peachpit.com/articles/article.asp?p=24273&seqNum=5&rl=1
http://www.sitepoint.com/article/oriented-programming-1
http://www.crockford.com/javascript/private.html
http://www.irt.org/articles/js169/index.htm
