How to Convert Byte Array to String in JavaScript ?

A Byte array is an array containing encoded data in the form of unsigned integers. It can’t be used directly. We have to decode it to get the meaning full data out of it. In this article, we will learn the conversion of a given byte array to a string of characters.

Various approaches to convert byte array to string are as follows:

Table of Content

  • Using WebAPI TextDecoder.decode() Method
  • Using Buffer and toString() Methods
  • Using JavaScript string.fromCharCode() Method
  • Using Base64 Encoding and Decoding
  • Using TextDecoder.decode() with Node.js Buffer
  • Using the String constructor with Array.join

Approach 1: Using WebAPI TextDecoder.decode() Method

The decode() method in TextDecoder API is used to take a stream of bytes as input and emit a stream of code points. The TextEncoder decode() method takes an ArrayBuffer containing the encoded data and options object and returns the original string (i.e. decoded string).

Syntax: 

decoder.decode( buffer, options );

Parameters:  

  • buffer: It is an ArrayBuffer, Dataview, or TypedArray instance that contains the encoded data.
  • options: It is an optional parameter that holds an object containing some properties. 
    • stream: It is a boolean value. It is set to true if data are processing in chunks and false if data are not chunked (by default its value is set to false)

Return Value:

 It decodes the encoded input in the buffer and returns the decoded string.

Example: In this example, we will create a string using the TextDecoder.decode() method from the Uint8Array instance.

Javascript
// Creating new byte array using
// Uint8Array instance
let byteArray = new Uint8Array([
    74, 97, 118, 97, 83, 99, 114, 105, 112, 116,
]);

// Creating textDecoder instance
let decoder = new TextDecoder("utf-8");

// Using decode method to get string output
let str = decoder.decode(byteArray);

// Display the output
console.log(str);

Output
JavaScript

Approach 2: Using Buffer and toString() Methods

Buffers are instances of the Buffer class in Node.js. Buffers are designed to handle binary raw data.

Syntax: 

let arr = new Buffer([16, 32, 48, 64]);

The JavaScript Array toString() Method returns the string representation of the array elements

Syntax:

arr.toString();

Example: In this example, we have implemented the Buffer and toString() Methods for converting the byte array to a String.

Javascript
// Creating new input array buffer
let byteArray = Buffer.from([
    74, 97, 118, 97, 83, 99, 114, 105, 112, 116,
]);

// Converting buffer to string
let str = byteArray.toString();

// Display output
console.log(str);

Output
JavaScript

Approach 3: Using JavaScript string.fromCharCode() Method

The JavaScript string.fromCharCode() method is used to create a string from the given sequence.

Syntax:

String.fromCharCode(n1, n2, ..., nX);

Example: In this example, we will use String.fromCharCode() method to get the string output from a given byteArray.

Javascript
// Input byte Array for
let byteArray = [
    71, 101, 101, 107, 115, 102, 111, 
    114, 71, 101, 101, 107, 115,
];

// Iterating array using array.map method
let str = byteArray
    .map((byte) => {
        return String.fromCharCode(byte);
    })
    .join("");
    
// Dipslay the output
console.log(str);

Output
w3wiki

Approach 4: Using Base64 Encoding and Decoding

Convert the byte array to a Base64 string using `btoa` after converting each byte to a character. Then, decode the Base64 string back to a normal string using `atob`. This method effectively handles the conversion via an intermediate Base64 representation.

Example: The byteArrayToBase64 function converts a byte array to Base64 string using btoa, and base64ToString converts a Base64 string back to the original string using atob

JavaScript
function byteArrayToBase64(byteArray) {
    return btoa(String.fromCharCode.apply(null, byteArray));
}

function base64ToString(base64) {
    return atob(base64);
}

const byteArray = [72, 101, 108, 108, 111];
const base64String = byteArrayToBase64(byteArray);
console.log(base64ToString(base64String)); 

Output
Hello

Approach 5: Using TextDecoder.decode() with Node.js Buffer

In Node.js environments, you can also utilize the TextDecoder class along with Node.js Buffer to decode byte arrays into strings.

JavaScript
// Importing the TextDecoder class from Node.js
const { TextDecoder } = require('util');

// Creating a new byte array using Buffer
let byteArray = Buffer.from([
    71, 101, 101, 107, 115, 102, 111, 
    114, 71, 101, 101, 107, 115,
]);

// Creating a TextDecoder instance with UTF-8 encoding
const decoder = new TextDecoder('utf-8');

// Decoding the byte array into a string
const str = decoder.decode(byteArray);

// Display the output
console.log(str);

Output
w3wiki

Approach 6: Using the String constructor with Array.join

Using the String constructor with Array.join converts a byte array to a string by mapping each byte to its character representation, joining them together into a single string using Array.join method.

Example

JavaScript
const byteArray = [72, 101, 108, 108, 111]; // ASCII codes for "Hello"
const str = byteArray.map(byte => String.fromCharCode(byte)).join("");
console.log("String:", str);

Output
String: Hello


Contact Us