3 uncommon JavaScript features

In this article, we will be addressing the 3 most uncommon JavaScript features. The importance of this subject relies upon benefits such as cleaner, more foolproof code, and easier debugging.

Logical OR ( || ) vs Nullish Coalescing Operator ( ?? ) 

The logical OR operator is sometimes used to provide a default value to an expression.

In case you provide non-boolean values to the operator, it will first try to convert it to a Boolean.

If a value can be converted to true, the value is so-called truthy. If a value can be converted to false, the value is so-called falsy. The intended use for this operator would be if the variable provided to it evaluates to falsy, a default value would be returned.

A common problem encountered here would be if the intended value evaluates to falsy.

As an example, let’s create a function that calculates the price of an item, with tax. We will provide a default value for the tax using the logical OR.

Passing undefined or null, would indeed fallback to the desired value, but what if we wanted to use 0 as tax? The OR operator converts 0 to a falsy value, thus returning the left hand operand.

To avoid this issue we can use the nullish coalescing operator ?? which considers as falsy operands only NULL or UNDEFINED.

Optional chaining 

The optional chaining operator (?.) permits reading the value of a property located deep within a chain of connected objects without having to expressly validate that each reference in the chain is valid. The ?. operator functions similarly to the . chaining operator, except that instead of causing an error if a reference is nullish (null or undefined), the expression short-circuits with a return value of undefined. When used with function calls, it returns undefined if the given function does not exist.

Let’s take this example:

We have created the adventurer object, and we try to access non-existent properties of this object. Let’s see how those 2 console logs react to this:

See how our first try did not throw an error?

Styling Console Logs

Did you know you could style your console logs? All of us at some point do some console log debugging, and oftentimes all of them look so much alike. Now what if we could style them up? Well, this is one of our 3 uncommon Javascript features.

Inserting a ‘%c’ format specifier will let you add another parameter with css rules to your console.log and it will affect everything coming after that.

Let’s give it a try:

We can even add different styles inside a single console log:

Your new 3 Uncommon Javascript Features 

Even if you are working on your code alone or have professional help, Javascript is your best friend by adding shortcuts and helpful elements.