Javascript basics, my thoughts

Almost every time I interview someone to work with Javascript, I use to make a question: “if I told you, hey, XXXX what is what you think I have to learn to start with Javascript and know it well (assume I already know how to program in any other language)?”

I have hear many different answers, thinks like: ES6, Promises, React,…

In the interviews I like to turn them in more a conversation than a questioning and like for other questions, I use to give mine about this one, here are the thinks I use to say:

1. Types

Javascript is a “dynamically, weakly typed” language, but it doesn’t mean there is no types, here are the types: number, string, boolean, null, undefined(yes), object and symbols(this was added in ES6).

References to learn more about types:

• https://javascript.info/types
• You Don’t Know JS: Types & Grammar (book)
• https://github.com/marijnh/Eloquent-JavaScript/blob/master/01_values.md (online book)

2. Types coercion

Once you know the types in Javascript, you start playing with comparisons between variables, then you must understand that under the hook , there is something call “type coercion” and it will play an important role in your code. When you understand this, you see clearly why and when use “==” or “===”.

References to learn about type coercion:

• You Don’t Know JS: Types & Grammar (book, great explanation)
• https://medium.freecodecamp.org/js-type-coercion-explained-27ba3d9a2839
• https://hackernoon.com/understanding-js-coercion-ff5684475bfc

3. Truthy and Falsy values

Once again, when you understand the types in Javascript you will know which values represent a truthy value and which ones represent a falsy value.

It’s important to build sentences like:

References to learn more about this topic:

• http://adripofjavascript.com/blog/drips/truthy-and-falsy-values-in-javascript.html

4. WTF is the “this”, closures and scopes (bind, apply)

One of the most “tricky” topics when you start coding in Javascript is to be aware of and understand the “this” and “scope” concept.

Understand the “this”, knowing what a closure is and know how and when to use “bind” and “apply” are key concepts that every Javascript developer must master.

As an advise, it’s very important to have this “topics” very clear before to start using classes.

Arrow function came to scene in ES6 and they are very important in this topics. Arrow function help us to handle the scope for async actions and it’s its principal value, not just using because you write less code(I’m a bit tired to hear this)

References to learn about this topics:

• https://medium.com/@jochasinga/context-smuggle-with-injection-6f38e0ae478e
• You Don’t Know JS: Scope & Closures (book)
• You Don’t Know JS: this & Object Prototypes (book)
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures

5. Prototype inheritance

Now that we have classes all around our code, it’s more important than ever to understand the “prototype inheritance” and how it’s different from classical inheritance (especially for people coming from languages like Java)

References to learn about this topic:

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain
• https://hackernoon.com/a-definitive-guide-to-javascript-prototypes-2c263788021e
• You Don’t Know JS: this & Object Prototypes (book)

6. Single thread (take this one carefully)

Working in client side, freezing the navigator because you are executing some heavy task in your code is one of the worst mistakes you can make. This is why you should have very clear how the navigator is running your code(modern browsers and techniques are improving this).

If you are writing Javascript code to build your backend app running with node.js, know and understand “the event loop” is a must for you. I was surprised of how many javascript developers don’t know about the “event loop” concept.

Write your code thinking in asynchrony is something very important when you start coding in Javascript.

Resources to learn about this topic:

• https://stackoverflow.com/questions/2734025/is-javascript-guaranteed-to-be-single-threaded
• https://www.youtube.com/watch?v=8aGhZQkoFbQ&t=25s (event loop explained very clear, I always recommend this one)
• http://voidcanvas.com/nodejs-event-loop/ (hard article about event loop)
• https://medium.com/codezillas/the-main-event-loop-3928adcd2413 (event loop, good article)

7. Asynchrony (events, callbacks, Promises, async/await)

You must think about asynchrony to work with javascript and to handle it well, you must master the principal techniques.

For many year, callbacks was the most used way to handle asynchrony in Javascript. This came with the well knowing problem “the callback hell”.

Then, mostly when the browsers and node.js runtime added it, the Promise became the principal way to handle async task.

Now, we have async/await all around us. You have “generators” too, but I think, Promise and async/await are the principal techniques you will need in your daily work.

You must understand this topics and know when to use one or another(mostly never callbacks XD). Check out my last article about this topic https://javascript.plainenglish.io/asynchrony-in-javascript-715221e21c2e

References to learn about this topics:

• You Don’t Know JS: Async & Performance (book)
• https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise
• https://medium.com/codebuddies/getting-to-know-asynchronous-javascript-callbacks-promises-and-async-await-17e0673281ee
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators
• https://medium.com/dailyjs/a-simple-guide-to-understanding-javascript-es6-generators-d1c350551950
• http://bluebirdjs.com/docs/getting-started.html (I really like this library for Promises)

Other topics:

Beyond the topics commented above, there is another topics I really like to recommend you:

1. Testing:

Really, this is an important one. Testing should be a first class citizen in your development workflow!. You should understand: what, when and how to test.

Common libraries and framework for testing in javascript are: Mocha, Chai, Sinon, Jest, Jasmine, etc…

I recommend you to find a good online course and get a good level in this.

2. Design Patterns

It’s not just for javascript but also but any other language you use, knowing, at least, the most common design patterns (Dependency Injection, Module pattern, Singleton, Adapter, Pub/Sub) , is a must.

For javascript, I recommend take a look to this book Javascript Design Patterns

3. Streams

I found myself using this one for concrete task like handle big amount of data, working with files, etc…

Getting some knowledge will help you in the future.

Resources:

• https://medium.freecodecamp.org/node-js-streams-everything-you-need-to-know-c9141306be93
• https://nodejs.org/api/stream.html (official doc)

4. Functional Programming

I think one of the most beautiful features in Javascript is that you can follow both Object Oriented or Function paradigms to develop your apps.

Getting some knowledge in function programming will improve your coding skills (not only in Javascript).

Some resources to learn about this:

• https://codeburst.io/functional-programming-in-javascript-e57e7e28c0e5 (just and example article)
• Eric Elliott (he use to share a lot of content related to Javascript and Functional programming, you can follow him in Medium or Twitter)

More general resources:

• https://eloquentjavascript.net/ (online version for the book)
• JavaScript: The Good Parts (book)
• Node.js Design Patterns (book)
• Complete book series “You don’t know JS” (here you have an online version)
• Programming JavaScript Applications (book)

I hope this can help you in some way. Thank for reading and please don’t hesitate to share any comment.