10 JavaScript hacks that developers should know

JavaScript is a language that has many functionalities and “powers”. You can start with very little and do good tricks, but you can also dig deeper into the language and discover several added values that lie within.

Let’s face it, basic knowledge already helps a lot in the most ordinary day-to-day tasks. However, we sometimes face performance issues or other enhancements that lead us to turn to more advanced tools.

With time and practice you’ll discover little shortcuts in the language to make your day-to-day life faster and simpler. In this article, I will share some JavaScript hacks that can be very useful for you, whether you are starting out as a web developer or looking to improve your code.

1) Conditional shortcuts

JavaScript allows the use of these shortcuts to improve code readability. They can be used to replace IF/ELSE structures or even return functions.

2) ~~ Operator

You can make use of the ~~ operator instead of Math.floor(). It yields a performance gain, not to mention it’s much easier to work with and remember.

3) Resizing an Array with array.length

You can always adjust the size of the Array through Array.length, often cutting it in half or even leaving it empty.

4) Low-cost merge of arrays

When merging arrays, especially when they are very large, there is a high overhead when choosing to use Array.concat(), largely because concat() will create a third Array as a result of the operation. In this case, you can use Array.push.apply(array1, array2), which basically puts the second Array inside the first one.

5) Default value with ||

Still using the shortcuts, you can have default values in case of inconsistency in variables or parameters.

6) Calculating array.length in large structures

When iterating over arrays, you can improve performance a bit by caching array.length. Instead of “calculating” each iteration, you can use the value before and always use the same variable in the loop. This JavaScript hack is especially useful in very large structures.

7) Further exploring the console

You can, and even must, explore more of the console’s powers. Get to know some examples in this Mozilla documentation https://developer.mozilla.org/. (Use the following examples in the browser console)

8) Accessing the Array using slice()

You can use the slice() method to access the Array at more strategic positions, such as the last ones, searching for one or more positions. You can carry this out by using negative parameters.

9) Falsy or Truly validation with the !! operator

The operator can be used to yield ‘false’ or ‘true’ results. Remember that the values 0, “”, null, undefined, NaN, as well as false will result in false.

10) Number to String and String to Number in no-time

You can convert a Number to a String and a String to a Number quickly.

Conclusion

Here are some tips to improve parts of your code. But don’t stop there! Find new ways to tackle your challenges. Start simple and listen to some feedback from other developers. There are many ways to solve problems. And there are always more JavaScript hacks to discover!