25 JavaScript Tricks You Need To Know

25 JavaScript Tricks You Need To Know

25 JavaScript Tricks You Need To Know (Including some useful bits of code and utilities): Type check util, Check for empty, Get any list last item, Random number generator with a range, Random id generator, Create a range of numbers, Format JSON string and stringify anything, Execute promise sequentially, Polling data, Wait for all Promises to complete, Swap array values place, Conditional Object key, Use variables as the object key, Check for key in object, Remove Array duplicates, Do “break” and “continue” in Array forEach, Destructuring with alias name and default values, Optional Chaining and nullish coalescing, Extend class with functions, Extend constructor functions, Loop anything, Make function argument required, Create modules or singletons, Deep clone object, Deep freeze object

While coding, you will notice that there are some things you stumble upon over and over, and normally they beg for that quick solution. A lot of these things do not even need you to install a library to solve it. These are my top 25 collected over the years.

  1. Type check util

  2. Check for empty

  3. Get any list last item

  4. Random number generator with a range

  5. Random id generator

  6. Create a range of numbers

  7. Format JSON string and stringify anything

  8. Execute promise sequentially

  9. Polling data

  10. Wait for all Promises to complete

  11. Swap array values place

  12. Conditional Object key

  13. Use variables as the object key

  14. Check for key in object

  15. Remove Array duplicates

  16. Do “break” and “continue” in Array forEach

  17. Destructuring with alias name and default values

  18. Optional Chaining and nullish coalescing

  19. Extend class with functions

  20. Extend constructor functions

  21. Loop anything

  22. Make function argument required

  23. Create modules or singletons

  24. Deep clone object

  25. Deep freeze object


1. Type check util

JavaScript is not a strongly typed language and to get that your best solution is TypeScript which I recommend but, sometimes all you need is a simple type check which JavaScript allows you to do with the “_typeof_” keyword.

The problem with “_typeof_” is that if you use it for some primitives and function it works great but for array and objects it becomes hard to know the difference since they are both considered “objects”

Image for post

Javascript Type checker Code on Github

2. Check for empty

Sometimes you just need to know if something is empty and depending on what you are checking, you need to use different methods like, checking the length, size, or if it contains any child elements. This util unifies all of that.

Image for post

Is Empty Checker Code on Github

3. Get any list last item

Other languages make this a method or function you can call on the array, but for JavaScript, you need to do some work.

Image for post

Last Item Getter Code on Github

4. Random number generator with a range

Sometimes you need to generate random numbers but you want these numbers to be in a range so, you need this small utility.

Image for post

Random Number Generator Code on Github

5. Random id generator

Just need some id? No need to install a new library for that unless you need some more complex id like UUID. Check these options.

Image for post

Unique Id Generators Code on Github

6. Create a range of numbers

One thing I love in Python is the range function and I often need it coding in JavaScript. Here is a simple implementation of it that is perfect for for…ofloop and whenever you need numbers in a specific range.

Image for post

Range numbers Generator Code on Github

7. Format JSON string and stringify anything

I find myself using this a lot when working on something with NodeJs to log objects to the console. The JSON.stringify takes a third parameter that must be a number of spaces to indent the line with. The second parameter can be null but you can use it to handle things like function, Set, Map, and Symbol that the JSON.stringify method does not handle or simply ignores.

Image for post

Javascript Any Object Stringifier Code on Github

8. Execute promise sequentially

If you have a bunch of asynchronous or normal function that returns a promise that you need to execute one after the other, this utility can help a lot. It takes a list of functions or promises and sequentially resolves them using the array reduce method.

Image for post

Async sequentializer Code on GitHub

9. Polling data

If you ever need to keep checking for data updates but don’t have WebSocket available in your system, this util lets you do just that. It is great for cases where you upload a file and you want to keep checking if the file is done processing, or you are working with a third-party API like dropbox or uber and you want to keep checking whether the process is complete or the ride has reached the destination.

Image for post

Polling function Code on GitHub

10. Wait for all Promises to complete

This is not quite a code solution but a good to know about the Promise API. It is constantly evolving and I used to have a code solution for the now available methods “allSettled”, “race” and “any” but I am glad just to tell you about them instead of sharing a code implementation of them.

Image for post

javascript node angular react web-development

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

How native is React Native? | React Native vs Native App Development

Article covers: How native is react native?, React Native vs (Ionic, Cordova), Similarities and difference between React Native and Native App Development.

Hire Node.JS Developers | Skenix Infotech

We are providing robust Node.JS Development Services with expert Node.js Developers. Get affordable Node.JS Web Development services from Skenix Infotech.

Hire Dedicated React Native Developer

Have you ever thought of having your own app that runs smoothly over multiple platforms? React Native is an open-source cross-platform mobile application framework which is a great option to create mobile apps for both Android and iOS. **[Hire...