As a developer who worked exclusively on the Microsoft stack for most of my career, the last five years have been an intense time of change and growth. A happy time for sure, but intense. The biggest change for me was adopting more and more JavaScript tools and technology. As a technical lead, I need to be “full stack” to be effective. Here’s what I did and I recommend you do to get your head around JavaScript.
Learning the Basics
Consider watching Crockford on JavaSCript. I do not believe, as everyone says, you need to read his book JavaScript, the good parts. Much like the Gang of Four patterns book, JavaScript the Good parts was important and timely in its publication, but there are now better resources now that cover the same content, specifically Kyle Simpson’s course Basic Programming with JavaScript. This course does a good job of explaining functional scoping, the role of “this”, and JS constructors, and more.
I also recommend getting Effective JavaScript. It is insightful, presents expert technical knowledge, and is well written. If you only have time to read one book on JavaScript, this is the one to read.
For keeping current add JavaScript Jabber to your podcast line up
For interactive learning, there is PluralSight and egghead.io. Many swear by Front End masters as well. Finally, I found codeacademy.com’s free JavaScript training valuable when just starting out.
About the Language
As a C# developer, I struggled with these parts more than others.
The this keyword. Pay particular attention to how, unlike in C#, the context of this changes depending on invocation. It is different than your intuition would have it be.
Scoping and Immediate invocation. JavaScript scopes at the functional level. It is not uncommon to see a function declared inside another function for this reason. It is also common to see a function declared and executed “in the same breath” to deal with JavaScript’s lack of sensible scoping. This is addressed in ES6, but I still need to work with ES5 code that uses IFFE’s and various module systems.
Variable hoisting. JavaScript behavior of compilation seems as if variable declarations are being ‘hoisted’ to the top - sometimes with unexpected behavior.
The comparison operator and implicit casting. JavaScript has both a double and a triple equals operator. The double equals operator implicitly casts, often with unpredictable behavior. The triple equal operator does not do an implicit cast. As a C# developer, the triple equals is most like what I think of as double equals. For instance
0 == ""evaluates truthy in JavaScript, but0 === ""does not. In neither case will you get a type error!The role of call, apply, and the ‘array like’ arguments keywords. If you delve into the source of libraries, you are going to encounter these as they add a lot of power to the language.
Prototypical inheritance. While ES6 brings with it traditional classes, it is useful to grasp JavaScript’s prototypical inheritance. It is useful and in many cases simpler than class inheritance. I found the best way to understand prototypical inheritance was to spend a day fiddling with a different more specific prototypical language called io.
JavaScript’s arrays and ‘arguments.’ Be aware that JavaScript arrays have unexpected behaviors and unfortunate performance characteristics. Additionally, there are cases where the language gives you an array-like object rather than a true array as in the case of the “arguments” parameter.