Most of the new users like me start learning JS from a very basic online course and then hang onto examples and some personal projects.
But in all this we miss many important features that any language provide and stick to structuring our application based on what we know.
So could you please highlight some features/design patterns each early stage JS developer should read about and try before developing his/her ideas.
(1) Learn to use objects as maps/hashes/dictionaries. Seriously. Don't do
"parallel arrays". (Along those lines, learn about own properties and the
prototype chain, so your code is own-properties safe.)
(2) Learn some of the wonderful stuff available on Array.prototype that leads to more functional-style code.
But, use map correctly! I've been fascinated in the kata at how many programmers want to use map() as their default array iterator, instead of forEach(). (The callback you pass into map should represents a transformation rule, and it should return a value. If the callback doesn't return a value, you probably should be using forEach() instead of map().)
The EcmaScript track is intended for learning ES6 (and beyond). It uses Babel to transpile down. Babel is farther along than Node.js in supporting ES6. In this track posters encourage each other to write solutions using ES6 features.
I'd say among the most commonly misunderstood features of JS definitely are things like the `this` keyword. Probably more than 90% of developers that I encounter don't know how it really works, only parts of it. The rest they treat as a black box of magic and unpredictability. It's actually quite simple. There's just 4 rules, and they're based entirely on how the function is called.
1. Is the `new` keyword used in front of the function call (like `new foo()`)? If so, a new empty object will be assigned to `this` inside that function call.
2. Is a `call(..)` or `apply(..)` used at the call site (like `foo.apply( someObj )`)? If so, that `someObj` will be the `this` inside that function call.
3. Is a context object used at the call site (like `obj.foo()`)? If so, that `obj` will be the `this` inside that function call.
4. Otherwise, default the `this` to the global object (in non-strict mode) or `null` (in strict-mode).
See? It's really not that hard. But most just never learn it. So `this` is mysterious for devs even seasoned by 10 or more years of development.
If you're interested in more info on `this`, check out Ch 1 and 2 of "this & Object Prototypes" of the YDKJS series.
How the `==` actually works (and compared to `===`) is probably another of the most misunderstood. Several chapters of "Types & Grammar" are devoted to explaining types and coercion, which are essential to realizing that `==` is not something to avoid in your code, but to embrace as a powerful tool (only if you know how to use it responsibly).