Implementing a Caesar Cipher in JavaScript

Written by

Walter G.

Comments

1

Published on

February 16 2021

Modified on

December 31 2023

Filed under

javascript

The Caesar Cipher is a simple cryptographic algorithm with a colorful history and one that can be implemented relatively easy in JavaScript.

Cipher's are a great way to practice your logical coding skills. Plus, they're kind of fascinating. Ciphers have been used for hundreds, if not thousands of years to transmit information between parties in a secretive fashion.

And while they are relatively outdated by today's standards, because they are incredibly simple to crack, they are still worthy of discussion.

But if you are looking for a more serious deepdive into cryptography, then I do recommend the following book in order to get started:

A brief history of the Caesar Cipher

Before we get to the code, let's get into what a Caesar Cipher is exactly.

A Caesar Cipher, also known as a Shift Cipher or a Caesar shift is a form of cryptography believed to have been used by Julius Caesar himself to transmit sensitive military information to his generals.

At its core, it essentially involves shifting the letters of the alphabet by 'n' amount either to the left or to the right.

A Caesar Cipher is (from a technical standpoint), one of the simplest ciphers to implement due to its single character replacement mechanism.

Here is a quick example of a Caesar shifted alphabet. 

ABCDEF...
CDEFGH...

You can easily spot that in this case we are only shifting the alphabet by 2 letters to the right.

It's quite possible that during its early days, the shift was indeed secure as most working people could not easily read.

Implementation

There are 2 different ways to implement the Caesar cipher. The first being that we create the new shifted alphabet ahead of time and perform a 1 to 1 lookup to find the new character to replace.

The second method involves shifting the letters in real-time as we navigate down the original message.

Both methods yield the exact same results. I will be showing the implementation to the first method down below.

Method #1

Let's start by creating 2 different variables. The first will represent the original alphabet in the original language, stored as one large string. And the second will represent the new shifted alphabet based on the 'n' shift parameter. That value will be empty by default.

var alphabet = "abcdefghijklmnopqrstuvwxyz";
var newalpha = "";

Now let's setup a function to create the newly shifted alphabet.

function shift(n){
	for (let i = 0; i < alphabet.length; i++){
		let offset = (i + n) % alphabet.length;
		newalpha += alphabet[offset];
	}
}

The algorithm essentially looks ahead by 'n' characters and it wraps around back to the beginning once it reaches the end of the alphabet.

This will give you the new alphabet to work with for the encoding phase.

Next up, let's create the actual encoding function.

The actual encoding logic is relatively straightforward for the most part. You simply take each of the letters in a given message and find its replacement character in the new alphabet.

function encode(message){
    let result = "";
    message = message.toLowerCase();
    for (let i = 0; i < message.length; i++){
        let index = alphabet.indexOf(message[i]);
        result += newalpha[index];
    }
    return result;
}

Here you can see it in action with a n = 1 shift to the right.

Demo

Decode

Now that we have an encoded string, let's work our backwards to decode the new message.

The process is essentially identical to the encoding. The only difference being that the new alphabet will be used as the lookup table.

function decode(message){
    let result = "";
    message = message.toLowerCase();
    for (let i = 0; i < message.length; i++){
        let index = newalpha.indexOf(message[i]);
        result += alphabet[index];
    }
    return result;
}

And that is a quick implementation of the Caesar Cipher. It's important to note that you probably should not use this to secure either your own or your clients personal data.

For that, you might want to take a look at encryption instead, which is different from either hashing or substituting.

Download on Codepen.io

Comments

G

1/3/2023 2:03:27 AM

Hello sir, the code you gave in the tutorial can't be decrypted, it's just encryption. I'm confused...

reply

Add comment