How to Convert a Binary String to Plain Text in JavaScript?

Computers understand the language of only two digits 1 and 0, called the binary system. In the binary system, everything is represented in the form of 1 and 0.

Everything that you see on a computer including text, images, audio, video or any other form of data, is just a combination of 1 and 0 only.

But for humans, understanding the data in the form of binary is never an easy task. We prefer reading the data in the form of plain text.

In this article, I’ll explain how you can convert a binary string to human-readable text with the help of simple JavaScript code. So, let’s dive right in.


Converting Binary String to Plain Text with JavaScript

Let’s say we have a giant string containing the data in the form of 0s and 1s. Each byte(a group of 8 bits) in the string is separated by a space character.

For example:

"01001000 01100101 01101100 01101100 01101111 00101100 00100000
 01001000 01101111 01110111 00100000 01100001 01110010 01100101
 00100000 01111001 01101111 01110101 00111111"

We want to convert this binary string into its equivalent text string.

The basic idea behind converting the binary string to plain text is to process the bits of the binary string in a group of 8 bits i.e. one byte at a time, and then convert each byte to its equivalent character and then join them back together to get the result.

Not getting the clarity? Here are the steps that you can follow:

  • Split the binary string at each space character(' ') using the String.split() method. This will give you an array of bytes(a group of 8 bits).
  • Process each byte of the byte array using the map() method.
  • Convert each byte to its equivalent decimal value using the parseInt() method.
  • Convert each decimal value to its equivalent text string using the String.fromCharCode() method.
  • Finally, join back each sub-string using the Array.join() method and get the result.

Let’s put all these steps together and write the code:

// Function to convert binary string to text
function binToText(binStr){
    
    // Get the bytes array
    const byteArr = binStr.split(' ');
    
    // Convert bytes to characters
    const charArr = byteArr.map(byte=>String.fromCharCode(parseInt(byte,2)));
    
    // Join back each character
    const textStr = charArr.join('');
    
    // Return the text string
    return textStr;
    
}

// Get text string from binary string
let text = binToText("01001000 01100101 01101100 01101100 01101111 00101100 00100000 01001000 01101111 01110111 00100000 01100001 01110010 01100101 00100000 01111001 01101111 01110101 00111111");

// Print the text string
console.log(text);

Output:

"Hello, How are you?"

In this example, we have used two built-in functions parseInt() and fromCharCode().

The parseInt() function parses a string and returns an integer value as a result.

It takes two parameters, first is the string to be parsed, and second is the radix or base of the number system to be used for parsing.

In our case, the string is a binary string, therefore, we pass the radix or the base value as 2 to convert it into an integer value(base 10):

// Binary string
const str = "01001000";

// Parse integer value from bin string
const num = parseInt(str, 2);

console.log(num);
// Output: 👉 72

The String.fromCharCode() method on the other hand creates a string from a given sequence of Unicode values.

It takes one or more Unicode values as arguments and returns a string corresponding to those values.

For example:

// Get string from Unicode values
const str = String.fromCharCode(65, 66, 67);

console.log(str);
// Output: 👉 "ABC"

2. Using a For Loop with fromCharCode() to Convert Binary String to Text

You can also use a regular for loop instead of the map() method to convert a binary string to human-readable text.

In this method also, we first split the binary string into a bytes array using the split() method.

And, then use a for loop to loop through each byte and get the string equivalent of each byte using the parseInt() and fromCharCode() methods.

// Function to convert binary string to text
function binToText(binStr){
    
    // Get the bytes array from binary string
    const bytesArr = binStr.split(' ');
    
    // Create an empty string to hold the result
    let textStr = '';
    
    for(let i = 0; i < bytesArr.length; i++){
        
        // Get text from binary chunk
        // and append to textStr
        textStr += String.fromCharCode(parseInt(bytesArr[i],2));
    }
    
    // Return the text string
    return textStr;
    
}

// Get text string from binary string
let text = binToText("01001001 00100000 01001100 01101111 01110110 01100101 00100000 01000011 01101111 01100100 01101001 01101110 01100111 00101110");

// Print the text string
console.log(text);

Output:

"I Love Coding."

You can use either of the two approaches to convert a binary string to a text string. Both approaches give the same result.

That’s all for the day. Happy Coding.

Author

  • Manoj Kumar

    Hi, My name is Manoj Kumar. I am a full-stack developer with a passion for creating robust and efficient web applications. I have hands-on experience with a diverse set of technologies, including but not limited to HTML, CSS, JavaScript, TypeScript, Angular, Node.js, Express, React, and MongoDB.

    View all posts