How to get the length of a string in bytes in JavaScript?

Javascript Web Development Front End Technology

In this tutorial, we are going to learn how can we get the length of a string in bytes in JavaScript. Before going into this we should what a byte is.

A byte is a unit of data that is 8 binary bits long i.e., 1 byte can hold up to 8 bits of binary data.

A byte is a unit most computers use to represent a character such as a letter, number, or typographic symbol.

Some examples of strings and their length in bytes are given −

Input

"Tutorials Point"

Output

15 bytes

Input

20€

Output

5 bytes

Input

"JavaScript"

Output

10 bytes

There are 2 approaches using which we can get the length of a string in bytes which are given below as −

Approach 1. Using the Blob API

In this approach, we are using Blob API to get the byte size of a string. Blobs allow you to construct file-like objects and convert string in array to create one, from that we are returning just size which will be byte size.

Steps

Steps to get the length of a string in bytes are as follows −

Step 1 − Create a function which is taking a string as input.

Step 2 − Now we pass the string into the Blob and store it in a variable

Step 3 − Use the size method to find the size in bytes.

Step 4 − Return the size of the string in bytes stored in a variable

Step 5 − At last we call the function and pass one string into it to get its byte size.

Example

We can use the below code to get the size of string in bytes using Blob API.


<!DOCTYPE html>
<html>
<head>
   <h2> Tutorials Point </h2>
</head>
<body>
   <script>
      const byte = (str) => {
         let size = new Blob([str]).size;
         return size;
      } 
      document.write(byte("Prince"))
      document.write("</br>")
      document.write(byte("JavaScript"))
      document.write("</br>")
      document.write(byte("Byte"))
      document.write("</br>")
      document.write(byte("Tutorials Point"))
      document.write("</br>")
      document.write(byte("1024"))
   </script>
</body>
</html>

Approach 2. Using the Buffer API

This is a special type of method used to get the byte size of a string. This method can only be used in the Nodejs environment you cannot use it in the browser. In this approach, we create a buffer object and then pass the string inside it and then use the length property to get the size the of string in bytes.

Steps

Steps to get the length of a string in bytes using buffer API are as follows −

Step 1 − Create a function which is taking a string as input

Step 2 − Now we pass the string into the Buffer.from() method and store it in a variable

Step 3 − Use the .length method to find the size of string in bytes.

Step 4 − Function will return the size of the string in bytes stored in a variable

Step 5 − At last we call the function and pass one string into it to get its byte size

Example

We can use the below code to get the size of the string in bytes using Buffer API.

<!DOCTYPE html>
<html>
<head>
   <h2> Tutorials Point </h2>
</head>
<body>
   <script>
      const byte = (str) => {
         let size = Buffer.from(str).length;
         return size;
      }
      document.write(byte("Prince"))
      document.write("</br>")
      document.write(byte("JavaScript"))
      document.write("</br>")
      document.write(byte("Byte"))
      document.write("</br>")
      document.write(byte("Tutorials Point"))
   </script>
</body>
</html>