Javascript hacks you should know in 2021

4 min readJul 15, 2021

If you’re learning javascript or already a JS developer then this story is for you. When I started my journey with JS, I wasted a lot of time in searching of time savings tricks, in this story I’ll tell you some JS tricks that every developer uses on the daily basis that saves your much time and makes you code much cleaner and easier to read.

1. Object destructuring

Desctructring is a expression which allows us to extract the values from arrays, objects, maps and sets into their own variables.
Let’s consider following example, here we have employee object. If we want to store the name of the employee we’ll assign it to new variable on new line, and if we want store the other values of the object we’ve to repeat this process again and again for each value.

with destructuring we can get the values of the object very easily using following syntax:

2. Get the last items from the array

If you provide negative integers to the Array.prototype.slice() method, it will return the values from the end of the array.

3. Swapping Two Variables

Generally we swap two variables using a temporary variable. Consider the following example

We have a syntax by which we can swap two variable without using temporary variable.

Javascript destructuring feature enables variable swapping without need an temporary variable.

4. Convert to Number

We can quickly convert string to a number just by adding + operator before the string.

We can also convert boolean to the number as well.

5. Convert to String

Same as above we can also convert number to a string. Just need to add + operator after the number.

6. String.prototype.replaceAll()

The new method replaceAll() brings us the small but very useful addition. As the name says it is used to replace the occurrences of the string.

Before replaceAll(), we would have to use RegEx to replace all occurrences of the string. Now we can use this new addition to replace the occurrences of the string quickly and easily.

7. Logical Assignment Operators

Let’s looks at the new logical assignment operators ??= , && =, ||= .

Logical Operator ??=

The logical Operator ??= (nullish coalescing) is a little different. If the first variable is null or undefined, the second variable will get assigned to it. Otherwise, nothing happens.

Let’s understand the nullish coalescing operator with the help of the example.

We can do the same thing using ??= , neat and clean.

2. Logical Operator &&=

The logical assignment operator &&= can be used between two variables or two values. If the first one is truthy, then the logical operator &&= assigns the second variable to it.

The logical assignment operator &&= is equivalent to the conditional statement below:

As we can see if the first variable is truthy, then second variable getting assigned to the first so a becomes 25 .

We can achieve the same thing using the logical assignment operator &&= .

3. The Logical Operator ||=

The logical assignment operator ||= is also used between two variables. But unlike &&=, if the first variable is falsy, then the logical operator ||= assigns the second variable to it.

The logical assignment operator &&= is equivalent to the conditional statement below: