Javascript Best Practices [closed]

What are some good resources to learn best practices for Javascript? I'm mainly concerned about when something should be an object vs. when it should just be tracked in the DOM. Also I would like to better learn how to organize my code so it's easy to unit test.

Seconding Javascript: The Good Parts and Resig's book Secrets of the Javascript Ninja.

Here are some tips for Javascript:

  • Don't pollute the global namespace (put all functions into objects/closures)
    • Take a look at YUI, it's a huge codebase with only 2 global objects: YAHOO and YAHOO_config
  • Use the Module pattern for singletons (
  • Make your JS as reusable as possible (jQuery plugins, YUI modules, basic JS objects.) Don't write tons of global functions.
  • Don't forget to var your variables
  • Use JSlint :
  • If you need to save state, it's probably best to use objects instead of the DOM.

I disagree to the "use a framework" statement to some degree. Too many people use frameworks blindly and have little or no understanding of what's going on behind the curtains.

I liked JavaScript:The Good Parts by Douglas Crockford although it's focused entirely on the language and ignores the DOM altogether.

If you don't feel like reading you can watch this video: JavaScript the good parts by Doug Crockford.

Probably the single most important thing is to use a framework, such as jQuery, or prototype, to iron out the differences between browsers, and also make things easier in general.

YUI Theatre has a bunch of videos (some with transcripts) by Steve Souders, Douglas Crockford, John Resig and others on JavaScript, YUI, website performance and other related topics.

There are also very interested google tech talks on Youtube on jQuery and other frameworks.

You can pick up a lot from Pro JavaScript Techniques, and I'm looking forward to Resig's forthcoming Secrets of the JavaScript Ninja.

As an addendum to the Crockford book, you may also want to check out this piece Code Conventions for the Javascript Programming Language. I also have a slightly different suggestion: instead of using a JS library off the bat, why not create your own? You may write a crappy library (as I did), but you'll learn something in the process. You have existing examples you can use as models. Also, to help give you an understanding of JS design patterns, I shall recommend another book, 'Pro Javascript Design Patterns'.

this article (with comments) is also very helpful :

Don't meddle with core types. Never stick something onto Array.prototype -- you don't know who else is doing that, and how such things might interact.

Only check explicit types when it matters. Duck typing is a good concept.

I want to second using anonymous functions to avoid pollution of the global scope. Especially when you work a lot with jQuery, as I do, it's really helpful to use a template like this:

(function($) {
    /* Lots of code */

use explicit casts for primitives, e.g. Number(), String(), Boolean()

Really? I avoid those like the plague. What's your thinking on that?

always use jslint.

It's a little bit frustrating at the beginning but it's beneficial.

Jslint will tell you if you break one or more of the "best practices".

Also consider using IDE that supports jslint. I can recommend WebStorm or Sublime Text 2 (these 2 i've tested myself and they support jslint very well).

This applies to all languages in general:

Avoid deep nesting, it is unacceptable and very hard to read. There are some techniques, for example in loops you can do an early break or continue next iteration instead of wrapping everything inside an if.