How to Convert ASCII to Hexadecimal in JavaScript

1. Convert an ASCII Character to Hexadecimal in JavaScript
2. Converting a String of ASCII Into Hexadecimal Equivalent in JavaScript
3. Convert Hexadecimal Back to ASCII
4. Remarks

The main intention to develop the American Standard Code for Information Interchange (ASCII) was to exchange data between devices. ASCII is a code table that has human-readable characters and it consists of each character mapped to specific numbers (the so-called ASCII codes). Like the binary base number systems used by computers, we use hexadecimal number systems while transmitting data over a channel for error-free communication. ASCII is a human-readable format, which is internally used differently by computers. Let’s see how we can convert an ASCII value to a hex value with JavaScript.

Convert an ASCII Character to Hexadecimal in JavaScript

The conversion is easy and doesn’t require many steps in the code. Let us look at the code for converting an ASCII character to hexadecimal.

window.onload =
    function() {
  convertASCIItoHex('A');
  convertASCIItoHex('n');
  convertASCIItoHex('!');
}

function convertASCIItoHex(asciiVal) {
  let asciiCode = asciiVal.charCodeAt(0);
  let hexValue = asciiCode.toString(16);
  console.log('0x' + hexValue);
}

Output:

0x41
0x6e
0x21

In this section, we are dealing with converting an ASCII character into the hexadecimal equivalent for it. We have the conversion process explained as follows.

Note

• It may appear weird to append the 0x keyword to the converted Hexadecimal value. It is a common approach followed in javascript to identify the number as a hexadecimal value (Refer MSDN Docs for more details). For your business purpose, we can avoid it and follow the hexadecimal value output from the .toString(16) function.

• The toString(16) function is a multipurpose function in javascript. We can use it to convert to different number base systems. We need to pass the decimal base or radix as a parameter to the function. If we look forward to a binary equivalent of the ASCII code, then the toString(2) function will return the binary equivalent of the decimal value. The function will typecast the object to a string before returning the binary value. And hence, return type of .toString() is string.

• The above code considers just one character conversion. Hence if you give a string as input like convertASCIItoHex("HELLO"), the function will return the hexadecimal value of the first letter “H”. It is done by the function charCode(0) in asciiVal.charCodeAt(0).

Converting a String of ASCII Into Hexadecimal Equivalent in JavaScript

The more common requirements we get in our lives are to convert a string as a whole into the hexadecimal equivalent value rather than a character. The following program takes a string as an input and returns a string of hexadecimal equivalent for each character as output. Each hex value will be separated by ' ' a space for better readability and understanding.

window.onload =
    function() {
  convertASCIItoHex('Hello!');
  convertASCIItoHex('Good Morning World!!');
}

function convertASCIItoHex(asciiString) {
  let hex = '';
  let tempASCII, tempHex;
  asciiString.split('').map(i => {
    tempASCII = i.charCodeAt(0)
    tempHex = tempASCII.toString(16);
    hex = hex + tempHex + ' ';
  });
  hex = hex.trim();
  console.log(hex);
}

Ouput:

48 65 6c 6c 6f 21
47 6f 6f 64 20 4d 6f 72 6e 69 6e 67 20 57 6f 72 6c 64 21 21

Here the convertASCIItoHex() returns a hexadecimal string value corresponding to the string input provided. It will return a value of type String. The string of hex codes is separated by spaces for readability and clarity. Let us look at the steps we followed.

Convert Hexadecimal Back to ASCII

Now, as we have the hexadecimal values ready, the question that arises is how do we confirm that the output is as expected. We achieve the core of the functionality with the fromCharCode(ASCIICode) function of javascript that returns the ASCII character corresponding to the ASCII code passed in the parameter. Here, we can use the following code.

window.onload = function() {
  convertASCIItoHex('48 65 6c 6c 6f 21');
  convertASCIItoHex(
      '47 6f 6f 64 20 4d 6f 72 6e 69 6e 67 20 57 6f 72 6c 64 21 21');
} function convertHexToASCII(hexString) {
  let stringOut = '';
  hexString.split(' ').map((i) => {
    tempAsciiCode = parseInt(i, 16);
    stringOut = stringOut + String.fromCharCode(tempAsciiCode);
  });
  console.log(stringOut);
}

Output:

Hello!
Good Morning World!!

A couple of methods do the magic here. parseInt(i, 16) converts an input of base 16 to decimal base. Hence, with this method, we get the ASCII code for the hex value. And the String.fromCharCode(tempAsciiCode) takes the ASCII code passed as a parameter to this function and returns the ASCII character corresponding to the code.

Remarks

• The most commonly used human-readable form of ASCII includes Alphabets, numbers, and special characters. With the javascript codes, we intend to cover these character sets. We cannot test certain ASCII codes in JavaScript, like the ACK: Acknowledge character, ETX: End of Text character, etc.
• JavaScript string variable can hold a length of maximum 2⁵³-1 characters as per ES8 standards. And that amounts to roughly 512MB of data in chrome and around a Gigabyte of data in Firefox. Hence, we can convert longer string values using our code.