How to Get the Length of a String in Bytes in JavaScript ?

In JavaScript, determining the length of a string in characters is straightforward using the length property. However, in many cases, particularly when dealing with file sizes, network protocols, or database storage, you might need to know the length of a string in bytes. This is because characters can be represented using different numbers of bytes, depending on the encoding. This article explores various methods to calculate the byte length of a string in JavaScript.

Why Byte Length Matters

The byte length of a string is important in scenarios where storage, transmission, and encoding constraints are critical, such as:

• Network Data Transmission: Ensuring data packets are within size limits.
• File Storage: Calculating file sizes accurately.
• Database Storage: Managing data that may be stored in binary formats or with specific encoding requirements.
• Data Serialization: Ensuring efficient data representation for APIs or protocols.

Understanding Encodings

Before diving into the methods for calculating byte length, it's essential to understand how text is encoded. The most common encodings are:

• UTF-8: Variable-length encoding that uses 1 to 4 bytes per character.
• UTF-16: Uses 2 or 4 bytes per character.
• ASCII: Uses 1 byte per character (limited to 128 characters).

Example:

Input: "GeeksForGeeks"
Output: 13 bytes

Input: 20€
Output: 5 bytes

Input: "????"
Output: 4 bytes

To achieve this we have two ways the first one is using the Blob API and the second is Buffer API, the first one works with the browser, and the second works with the Node.js environment. blob object is simply a group of bytes that holds the data stored in a file. To read the bytes of a string using blog we create a new instance of Blob object then we pass the string inside it and by using the size property we can get the bytes of a string.

Using Blob API

The Blob interface creates a binary large object from the string and returns its byte size. It’s useful for handling file-like data in web browsers. This approach is straightforward and works well with browser-based JavaScript.

const len = (str) => {

  // Creating new Blob object and passing string into it 
  // inside square brackets and then 
  // by using size property storin the size 
  // inside the size variable
  let size = new Blob([str]).size;
  return size;
} 

console.log(len("Geeksforgeeks"))
console.log(len("true"))
console.log(len("false"))
console.log(len("12345"))
console.log(len("20€"))
console.log(len("????"))

Output:

13
4
5
5
5
4

Using Buffer in Node.js

The Buffer class in Node.js calculates the byte length of a string based on the specified encoding. It’s highly suitable for server-side applications, offering flexibility for various encodings. This method is accurate and efficient for Node.js environments.

const len = (str) => {
  let size = Buffer.from(str).length;
  return size;
} 

console.log(len("Geeksforgeeks"))
console.log(len("true"))
console.log(len("false"))
console.log(len("12345"))
console.log(len("20€"))
console.log(len("????"))

Output:

13
4
5
5
5
4

Using the TextEncoder API

The TextEncoder API provides an efficient way to encode a string into a specific format (e.g., UTF-8) and retrieve its byte length.

function getByteLength(str) {
  const encoder = new TextEncoder();
  const byteArray = encoder.encode(str);
  return byteArray.length;
}

// Example usage:
const str = 'Hello, ?!';
console.log(getByteLength(str));

12

devi_johns

Follow

Improve

Article Tags :

• JavaScript
• Web Technologies
• Node.js
• NodeJS-Questions
• JavaScript-Questions

+1 More