Cipher using JavaScript!

What is a Cipher?

Cipher refers to the algorithm for performing encryption and decryption of data, it consists of well-defined steps to convert the original message also called plaintext into ciphertext using a key to determine how the encryption and decryption can be performed.

A cipher can be a complex algorithm or just a simple algorithm like ROT13 (rotate by 13 places) which is a simple letter substitution cipher that shifts the alphabet in the message and replaces it with the alphabet that is thirteen places ahead of it.

ROT13 Cipher:

This Image shows each letter and the to what letter it will be replaced when using the ROT13 cipher algorithm.

An example of how to encrypt the word "HELLO" Using ROT13 is shown in the image as well and as we can see that it is converted to be: "URYYB"

Which look like random letters but when we use the key we can decrypt these letters back to the original text which is "HELLO".

JavaScript Cipher:

In JavaScript, you can actually build your own encryption algorithm to be used for encrypting data and using a key to decrypt the data into plaintext.

There are different types to create ciphertext and here are some of them:

1. Private-Key based: In this type of encryption the same key will be used for encryption as well as decryption. This type should be kept private.
2. Public-Key based: In this type of encryption there will be two keys one for encrypting the data (Public Key) and one is used for decrypting the data (Private Key).
3. Substitution method: In this method of encryption the characters are replaced by some other characters which make it difficult to read.
4. Transposition method: In this method of encryption the order of each letter is rearranged in a way that the data can't be read.

Let us now create a ciphertext using JavaScript!

ROT13 using JavaScript:

Since we talked and explained about ROT13 which is considered to be a Substitution method for encrypting data. We are going to create a cipher in JavaScript using it.

We will be converting only the capital English letters (A-Z).

There are two important JavaScript methods we are going to use to convert plaintext into ciphertext:

• charCodeAt() - This method will return the Unicode of the character at the specified index in a string.
• String.fromCharCode() - This method converts the Unicode values to characters.

Let's look at an example of how these methods can be useful:

let str = "Hello World!"
for (let i = 0; i < str.length; i++){
    let unicode = str.charCodeAt(i)
    let character = String.fromCharCode(unicode)
}

• We have the string "Hello World!" saved in a variable called "str".
• Using a for loop to go through each character and then assigning the Unicode of each character using charCodeAt() to the variable "unicode".
• After that, we will convert the Unicode values back to characters by using String.fromCharCode() and assigning it to the variable "character".
• Using Console.log() to display the Unicode of each character in the variable string str and convert it back to the original character.

We can check the Unicode from the ASCII table here:

The Complete Character List for UTF-8

• To create the ROT13 we will start by doing a function called rot13 with a parameter called str which takes the text we want to encrypt. (Note since this is a Substitution method of encrypting data the same function will be used to decrypt the data).
• We will create a new variable called newStr to save the encrypted or decrypted message inside it.
• Now we can save the character's Unicode of each letter in the str in a variable called unicode with the help of for loop.

function rot13(str){
    let newStr = [];
    for (let i = 0; i < str.length; i++){
        let unicode = str.charCodeAt(i) //Each Character Unicode in UTF-8
    }
}

• After saving the Unicode for each character we will use an if statement to check if the Unicode is equal to 32 or more and equal to 64 or less. These are the characters for Numbers, Signs, or Punctuation.
• If the character is a Number, Sign, or Punctuation then there will be no change to the Unicode and we will convert the Unicode back to the same character and push it into the (newStr).

if (unicode >= 32 && unicode <= 64) {
  let newUnicode = String.fromCharCode(unicode)
  newStr.push(newUnicode)
}

• Else if the character we are trying to shift will exceed the last letter (Z) in the ASCII table above we can see that the decimal number for it is (90).
• Then we will make sure that the ciphertext is in the range of (A-Z) by taking the Unicode plus 13 to shift the character by 13 places and then deducting 26 which is the number of English letters to start from (A).
• Finally, we will push the ciphertext to (newStr).

// Here we will check if we shift the character by 13 places and it exceeds the Last letter (Z).
// then we make sure that the ciphertext will be in the range of (A-Z) by taking the (Unicode + 13-26) so that the new character will be in the range of (A-I).
else if (unicode + 13 > 90) {
    let newUnicode = String.fromCharCode(unicode + 13 - 26)
    newStr.push(newUnicode)
}

• Else we will be shifting the character by 13 places and pushing the ciphertext to (newStr).
• The function finally will return the newStr after joining all the characters together using join('').

//Shifting the character by 13 places.
else {
  let newUnicode = String.fromCharCode(unicode + 13)
  newStr.push(newUnicode)
 }
}

//Joining the ciphertext together
return newStr.join('')

Here is the full code for the function:

function rot13(str){
    let newStr = [];
    for (let i = 0; i < str.length; i++){
        let unicode = str.charCodeAt(i) //Each Character Unicode in UTF-8

        //The first if statement will check if the character is a Number, Sign, or Punctuation.
        // It will then push the same character to the newStr.
        if (unicode >= 32 && unicode <= 64) {
          let newUnicode = String.fromCharCode(unicode)
          newStr.push(newUnicode)
        }

        // Here we will check if we shift the character by 13 places and it exceeds the Last letter (Z).
        // then we make sure that the ciphertext will be in the range of (A-Z) by taking the (Unicode + 13-26) so that the new character will be in the range of (A-I).
        else if (unicode + 13 > 90) {
        let newUnicode = String.fromCharCode(unicode + 13 - 26)
        newStr.push(newUnicode)
        }
        
        //Shifting the character by 13 places.
        else {
            let newUnicode = String.fromCharCode(unicode + 13)
            newStr.push(newUnicode)
        }
    }   
        //Joining the ciphertext together
        return newStr.join('')
}

Results:

Now we can call the function and see what will happen if we typed for example "I LOVE PROGRAMMING!"

let result = rot13('I LOVE PROGRAMMING!')
console.log(result) // V YBIR CEBTENZZVAT!

The result shows us the ciphertext "V YBIR CEBTENZZVAT!". Let us do it again but this time using the ciphertext to convert it back to the original text.

let result = rot13('V YBIR CEBTENZZVAT!')
console.log(result) // I LOVE PROGRAMMING!

Reference:

• https://en.wikipedia.org/wiki/ROT13
• https://www.conceptatech.com/blog/difference-front-end-back-end-development
• https://blog.cloudboost.io/create-your-own-cipher-using-javascript-cac216d3d2c
• https://blog.cloudboost.io/create-your-own-cipher-using-javascript-cac216d3d2c