JavaScript Style and jQuery Best Practices
Table of Contents
- 1. Symbols
- 2. Documentation
- 3. Framework (jQuery)
- 4. Files
- 5. Naming conventions
- 6. Grammar
- 7. Operators
- 8. Objects
- 8.1. Variable Declarations  crockford
- 8.2. Function Declarations  crockford rashbrook
- 8.3. Names  crockford
- 8.4. Statements  crockford
- 8.5. Don't pollute the global namespace
- 8.6. Newlines follow anonymous functions with jQuery  style
- 8.7. jQuery variables  style
- 8.8. Disallow
= and ! jslint - 8.9. Cache function pointers  performance
- 8.10. Avoid Using the ‘with’ Keyword  style
1. Symbols
1.2. Required blocks
http://jslint.com/lint.html This is a jslint recommendation to enclose
4. Files
4.3. JavaScript in element attributes  progressive
When working with jQuery there is generally a preferred layout to keep pages readable.
http://icant.co.uk/articles/seven-rules-of-unobtrusive-javascript/
4.4. Load scripts late  files crockford performance
Late in the body as possible
6. Grammar
6.1. Indentation: 4 spaces  style crockford
Audit: untabify.
6.5. Required blocks: true  jslint
if (condition) { statements; }
8. Objects
8.2. Function Declarations  crockford rashbrook
rashbrook: Name inline functions This might not be a best practice, doesn't appear to be used: observe: function offlineObserve(aSubject, aTopic, aState)
8.3. Names  crockford
Disallow leading _ in identifiers
8.5. Don't pollute the global namespace
This should be moved into separate sections:
Play well with others (Namespacing, scope and patterns) in http://icant.co.uk/articles/seven-rules-of-unobtrusive-javascript/
This would cover the use of body onload activities, global values, etc.
recommends:
Use the var keyword. Any variable created without the var keyword is created at the global scope and is never eligible for garbage collection, presenting the opportunity for a memory leak.
Use a global array, global object, or namespace prefix. If you need global variables, use a global object that contains all of the global variables, like this
8.6. Newlines follow anonymous functions with jQuery  style
Split any method calls that invoke anonymous foundtions. This should be done to reduce the amount of extra whitespace but makes the scripts longer
8.7. jQuery variables  style
If a jQuery object is returned should a "$" prefix be used?
http://dotnetslackers.com/articles/ajax/JQuery-Primer-Part-1.aspx
This isn't recommended since it violates ECMA 262 guidelines.
8.9. Cache function pointers  performance
For iterating through DOM elements initialize the variable:
styles = getElementsByClassName("script); for (var i = 0; i < styles.length; i++) { console.log(styles[i]); }