Teaching JavaScript to Java programmers

Question

In a few weeks, I'm going to have the opportunity to introduce my coworkers to JavaScript. Previous projects here have used primarily Java and C++. What are the most important or foreign aspects of JavaScript that I need to explain? I have a short list of big things I've already identified:

• Hashes/dictionaries as objects
• Prototypal inheritance
• Closures
• Binding

I'm also going to pull from A re-introduction to JavaScript.

What have I missed? I'm looking for anything, from big language features to small gotchas.

Answer 1

Teaching DOM and HTML is better. This forms a good fundamental for Javascript.

Answer 2

First Gotcha make sure they know Java != JavaScript ;)

Answer 3

Check all of the sessions of Doug Crockford at YUI Theater. They are called "The Javascript Programming Language", "Javascript, The good parts", "DOM, An inconvinient API" and "Advanced Javascript". It may serve you as a source when drafting the curriculum and showing some of it may take away the "Mickey Mouse language" prejudice the java programmers will naturally have.

You can download all of these sessions.

Answer 4

The literal syntax of javascript, as used in JSON is also an important feature. Not difficult, but still important.

Answer 5

JavaScript is highly dynamic, which is hard to grasp for static-language people:

Dynamic

dynamic typing

As in most scripting languages, types are associated with values, not variables. For example, a variable x could be bound to a number, then later rebound to a string. JavaScript supports various ways to test the type of an object, including duck typing.

objects as associative arrays

JavaScript is almost entirely object-based. Objects are associative arrays, augmented with prototypes (see below). Object property names are associative array keys: obj.x = 10 and obj["x"] = 10 are equivalent, the dot notation being merely syntactic sugar. Properties and their values can be added, changed, or deleted at run-time. The properties of an object can also be enumerated via a for...in loop.

Answer 6

One gotcha that I expect is worth mentioning explicitly is the difference of scoping. For example, I basically went from Java to Javascript and it took me ages to see why code like the following didn't work as expected (i.e. every button alerts "Button 9"):

function myFn() {
   ...
   for (var i = 0; i < 10; i++) {
      elems[i].onClick = function() { alert ("Button " + i); };
   }
}

Even when you read the explanation and can follow it, it still takes a while before you can instinctively spot code that's making this mistake.

Answer 7

I actually found this really excellent link mapping OO concepts in JS for a C++ dev the other day, it should be appropriate here because once you get past the syntax variants, the question is "how do you do X?"

Oh and first class functions!

Answer 8

If memory serves, my first mental leaps for JavaScript were:

1 - it's in the HTML, but it's making the HTML. Figuring out how to organize it for sanity, and to put it in the right place to do the right thing was key.

2 - the server delivers it but it runs on the client. The fact that the code is running inside a browser, in a location that cannot directly access the internals of the server takes some getting used to.

3 - when to use it. There's many points where JSP (or other server side dynamic page generation mechanism) or JavaScript can be used. It's important to have a feeling for when it's the right tool for the job. It's not unusual to see new JavaScript developers do everything in JavaScript. Now that they have a hammer, the whole world has been converted to nails.

4 - testing & debugging - I know there's better and better tools out there, but realizing that retesting is needed for each supported browser, and how to debug browser code in each browser is a big thing the books never seemed to teach very well.

Answer 9

You're definitely going to want to spend some time explaining that there is no such thing as classes in Javascript, and the differences between prototype-based inheritance and class-based inheritance.

If you're talking to a bunch of Java/C++ coders, I could see this being a sticking point.

Answer 10

Tell them all to get copies of Javascript: The Definitive Guide.

I'm a career C++ programmer who had to learn Javascript a couple of years ago, and this book was absolutely invaluable in terms of learning the language. It's also got a great reference for some of the native Javascript objects like String and Number.

Answer 11

Also teach them about libraries, such as this obvious example. For a lot of cases, declarative > imperative when manipulating the DOM. Also it's just so pretty.