You Don’t Know JS: My learnings from Up & Going

TLDR: I’m trying to gain a deeper understanding of JavaScript. I thought I’d do so by reading the You Don’t Know JS (YDKJS) book series. I’m blogging my learnings from the first book, Up & Going, here. For more context, check out my earlier post.

3 Aug 2017 | 10:04 pm

Double equality vs triple equality

I always thought the difference between == and === was this: the latter ensures the types of the two values being compared are the same, and the former doesn’t. Simple as that.

Turns out that’s not entirely what’s going on. == checks for value equality with coercion allowed, and === checks for value equality without allowing coercion.

So in the first console.log above, JavaScript sees the types are different and attempts to coerce, or convert, the values to the same type before checking if they match. After the coercion what gets checked is whether 10 == 10 , rather than 10 == “10” .

In the second console.log, JavaScript won’t attempt any coercion, so it literally checks whether 10 and “10” are equal.

YDKJS goes into some cool detail about this here.

4 Aug 2014 | 8:30 am

The break in switch statements

I had somehow forgotten what the break in a switch statement is actually doing! Maybe because I don’t often see switch statements used without a break in every case?

Anyhow, it was nice to be reminded of break’s purpose: to prevent execution from continuing into the next case statement, even if the value doesn’t match the case.

Check out the two switch statements below — the first has a break in every case, the second doesn’t — and see what gets logged to the console.

YDKJS goes into more detail about conditionals here.

“use strict”

If you’d have asked me to explain what “use strict” does, I couldn’t have told you much more than that it enforces a “stricter mode” of JavaScript.

After reading the section on strict mode in this book, I can now tell you one actual (and cool) thing that it does.

When you have “use strict” in a file or a function — it can be applied at either level — and you try to declare a variable without using the word var, you will get an error.

When you don’t include “use strict” in a file or function, and you try to declare a variable without using the word var, the variable will automatically be assigned to the global scope.

Functions

I’ve got to admit, the different ways of writing JavaScript functions (See my Gist below) still confuse me.

YDKJS says: “named function expressions are generally more preferable, though anonymous function expressions are still extremely common”.

Because this is the intro book it doesn’t really explain why. I’m looking forward to going deeper on this later in the series.

Closure

I really enjoyed the way the book explains closure, and found this definition particularly succinct and useful:

You can think of closure as a way to “remember” and continue to access a function’s scope (its variables) even once the function has finished running.

7 Aug 2014 | 6:30 pm

The value of this

In the back of my mind I had a vague, fuzzy understanding that the value of this had something to do with the way a function was called, rather than the function that this is inside of.

Up & Going explains this concept super clearly. Here’s my summary:

The book says:

…to understand what this points to, you have to examine how the function in question was called. It will be one of those four ways just shown, and that will then answer what this is.

Polyfilling and transpiling

I was already familiar with transpilers, having used Babel to transpile ES6 to ES5. But it was still good to read an explanation of the difference between polyfilling and transpiling.

Polyfilling is “taking the definition of a newer feature and producing a piece of code that’s equivalent to the behaviour, but is able to run in older JS environments,” it says. The example it uses is the ES6 feature Number.isNan() . You can check if Number.isNan() is present in the browser, and if it’s not, write your own function for it.

Polyfilling works well for functions, but “there’s no way to polyfill new syntax that’s been added to the language”, it says.

“So the better option is to use a tool that converts your newer code into older code equivalents.” This is transpiling.

9 Aug 2014 | 5:45 pm

Finished

I’ve finished my first JavaScript book!

OK, so maybe this one shouldn’t count, considering it’s only the introductory book in the YDKJS series. Still, I really enjoyed it and can’t wait to move on to the second book, Scope & Closures. I’ll start a new blog with my learnings from that one soon. Keep an eye out!