views:

503

answers:

5

We have a CMS built on Java and it has Mozilla Rhino for the server side JS. At the moment the JS code base is small but growing. Before it is too late and code has become a horrible mess I want to introduce some best practices and coding style.

Obviously the name space control is pretty important. But how about other best practices - especially for Java programmers?

+1  A: 

Since you have a JS engine in Java, make it a habit to write unit tests for your JS code. Select a coding style and apply it vigorously. If possible, use tools to check that the code submits to the coding style.

Aaron Digulla
+3  A: 

I would look at CommonJS (formerly ServerJS). It's very much a work in progress, but they have a standardized module system with several implementations. There are already some useful libraries written to the CommonJS spec, like Narwhal.

Matthew Crumley
+2  A: 

As Douglas Crockford likes to say, JavaScript is the worlds most misunderstood programming language. Though many people don't know it, there is a right way to code in JavaScript. I have no doubt that if you let Java developers start coding before understanding how to write good JavaScript you will run into serious trouble.

The first thing to do would be to make sure everyone has read Mozilla's excellent article, A re-introduction to JavaScript (https://developer.mozilla.org/en/a%5Fre-introduction%5Fto%5Fjavascript). One of the biggest problems with JavaScript is that there are many ways to do most common tasks, and this article should get people on the same page. Another essential reference is Douglas Crockford's work, including JavaScript: The Good Parts.

One other thing that gets a lot of Java/C++ programmers is that JavaScript uses function scope NOT block scope. This can cause some very tricky problems. There's a great article about this issue at A List Apart called Binding in JavaScript.


To summarize the major issues talked about in the above resources, the most crucial differences to learn are

  • how to write object oriented code using prototypal inheritance (vs.class based inheritance)
  • how to use closures and lambdas
  • how to utilize the power of dynamic objects
  • how to write function-scoped code
Zach Bialecki
+13  A: 

Here's some tips from the front lines:

  • Like Java, use docblocks in Doxygen/JsDoc style for functions
  • Unit test. Personally like JsTestDriver, as it can be executed automatically from CI server too.
  • Use JSLint. It will nitpick about bad code
  • Consider using Google Closure Compiler. It will nitpick about code like JSLint, but it can be helpful for spotting poor doc blocks etc.
  • Make sure everyone on your team understands how closures work. Otherwise it'll lead to headaches
  • As you mention, namespaces are important especially if you want your code to work nice with other JS libraries (var myns = myns || {};)
  • Personally I find using a library which provides OOP helpers like classes etc. helpful. You could use prototypal inheritance but it's often a bit trickier that way.
Jani Hartikainen
+1 to you. I was going to write up my own answer, but the simple truth is you hit most of the common points that, simple as they are, no one really does. May I just reiterate bullet #1 and #2, I don't know what gets into JS developer's heads, it's like they think because they write JavaScript they are absconded from good programming practices.
jeremyosborne
Can I reiterate the JSLINT suggestion, and add that this should replace the compilation step in any continuous integration setup you have. If the code fails JSLINT, it should not be checked into the repository. Some people disagree with some of the checks JSLINT does, but I must emphasize that integrating JSLINT in this way will prevent SYNTAX errors, which break otherwise working code, from being incorporated into a product.
Breton
And be sure to use JSLint and not Javascript lint. They are two seperate products. It's not that javascript lint is bad, but it doesn't catch implicit globals, and JSLINT does. Your code should not have any implict globals you do not know about. JSLint also provides a way for you declare all the globals that you do know about in a specially formatted comment. Having this comment at the head of every .js file is incredibly useful anyway, jslint or not.
Breton
Another couple things to add: Try and use an IDE which can run javascript code as an extension, and make yourself familiar with this feature. Eclipse is one such IDE. In this way, you can incorporate tools like JSLINT directly into your code editing environment. Once you get this working you can also use http://jsbeautifier.org/, http://boyopeg.googlepages.com/jsmeter.html, your favorite minifier/compiler, and you'll be able to write your own code modifying tools in javascript to enforce whatever other coding standards you have.
Breton
And do not overlook file naming, scoping and folder organization standards.
Breton
+1  A: 

Below are few links which may help you :

Javascript Best Practices

JavaScript Best Practices pdf file

PJ