Generate a UUID in JavaScript (Best Method)

 

UUID provides a standardized method for handling various situations and generating unique identifiers in various applications. This is something that most amateur programmers don’t know about it. So, let’s learn what this is and how to generate it in JavaScript.

What is a UUID?

UUID stands for Universally Unique Identifier and it helps to generate unique identifiers across various applications. UUID helps to generate unique identifiers across both time and space which means the probability of collision of two UUIDs is extremely low. 

The structure of a UUID is unique and consists of 32 hexadecimal characters, which helps in reducing the probability of collision of two UUIDs very low.

Its structure is basically in the format 8-4-4-4-12. For example: f47ac10b-58cc-4372-a567-0e02b2c3d479.

There are various fields in the domain of development where the use of a UUID is crucial. Some of the use cases of UUID are:

• Primary Keys: Primary keys are unique and not null keys in a database that help to identify a tuple uniquely in a database. Due to the unique nature of the primary key, UUID is used to generate it.
• Cryptographic Applications: In cryptographic applications, we use different keys to convert our plain text into cipher text to make it more secure and prevent our data from being hacked. Thus, we use a UUID to generate those unique keys to secure our information.
• Version Control Systems: In different version control systems we need to keep track of our various commits. Thus we assign them unique IDs with the help of UUID to easily track them.
• Session Management: We also use UUID to keep track of various user sessions.
• File Naming: We can also use UUID to uniquely name our various files in such a way that there is no collision in naming and that files can be tracked easily.

There are also various other fields and situations where we can use a UUID.

There are various ways to generate UUID. Some of the Common ways to generate UUID are listed below:

1. Using an external npm package
2. By making a custom function in javascript to generate UUID.

1) UUID Generation Using npm

Earlier, npm was the default package manager for the Node.js environment; that’s why it was called Node Package Manager, but nowadays, it contains packages other than the Node Js environment thus, there is no default full form for npm today.

To generate UUID using npm we can use the ‘uuid’ package.

First, we need to install the uuid package using npm.

Here is how we can do it:

npm install uuid

After installation is complete, we can easily generate a UUID using it. Here is a demonstration of how it is done.

// Import the v4 method from the uuid package
const { v4: uuidv4 } = require('uuid');

// Generate a UUID using the uuidv4 method
const uuid = uuidv4();

// Log the generated UUID to the console
console.log(uuid);

After the successful installation of the package, we imported the v4 method from the uuid package in our application. 

Then, we called the uuidv4 function that we imported and stored its result in a variable uuid. The uuidv4 function directly gives us a unique identifier without taking any other parameters. Our output window will contain the generated uuid.

This is the simplest method to generate a UUID as we only need to import a function and call it without passing any extra parameters which provides us with a unique identifier.

2) Generating a UUID Using a JavaScript Custom Function

To generate a UUID, we can use a custom function that creates a UUID string based on a template (‘xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx’) and then replace characters inside the template using some logic.

This method uses the browser to generate a UUID, and it is a little complex to understand.

Here is a demonstration of how we can do this.

// Function to generate a Version 4 UUID (randomly generated)
function generateUUID() {

  // UUID template with placeholders for hexadecimal characters
  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
    // Generate a random hexadecimal character for each 'x' or 'y' placeholder

    var r = Math.random() * 16 | 0; 
    // Generate a random number between 0 and 15

    var v = c === 'x' ? r : (r & 0x3 | 0x8);
    // For 'x' placeholder, use random number; for 'y' placeholder, 
    // use a random number bitwise ANDed with 0x3 ORed with 0x8

    return v.toString(16);
    // Convert the generated number to its hexadecimal representation

  });
}

// Call the function to generate a UUID and log it to the console
console.log(generateUUID());

Thus when we call our generateUUID function, our UUID gets generated and gets printed in our output window.

Conclusion

In this article, we have thoroughly explored UUID in Javascript. We have navigated through the meaning of UUID, its structure, and various use cases of UUID along its generation using two different methods.