Le chiffre de César en JavaScript

Exécuter le code

Le plus rapide reste le navigateur : appuyez sur F12, ouvrez l’onglet Console, collez le code et validez. Pour l’exécuter hors du navigateur, enregistrez-le sous le nom caesar.js et utilisez Node.js :

node caesar.js

Si le chiffre lui-même est nouveau pour vous, le guide l’explique sans code.

Comment fonctionne le code

La boucle for...of lit le texte caractère par caractère, et l’expression régulière repère les lettres de A à Z, en majuscule comme en minuscule. charCodeAt(0) donne le numéro d’une lettre : 66 pour B et 98 pour b. En retirant 65 ou 97, on obtient son rang dans l’alphabet, de 0 à 25.

Une fois le décalage ajouté, le modulo revient au début de l’alphabet : avec un décalage de 3, le Z tombe sur le C. String.fromCharCode repasse ensuite du nombre à la lettre.

Tout le reste passe par la branche else sans changer, y compris les lettres accentuées, que l’expression régulière ne retient pas.

Déchiffrer en JavaScript

Inutile d’écrire une seconde fonction. Déchiffrer revient à décaler dans l’autre sens : il suffit de passer un nombre négatif.

console.log(caesar("Erqmrxu à wrxv !", -3));// Bonjour à tous !

D’où le + 26 supplémentaire dans la formule. En JavaScript, % conserve le signe du nombre de gauche : -3 % 26 vaut -3, et String.fromCharCode renverrait le mauvais caractère. En ajoutant 26 puis en reprenant le modulo, on obtient 23, et le A revient au X. Dans la version Python, l’opérateur % s’en charge déjà.

Le chiffre de César sur une page web

Voici une page complète : enregistrez-la dans un fichier .html et ouvrez-la dans un navigateur. Le résultat change à mesure que vous tapez, et tout se passe sur votre ordinateur.

<textarea id="text"></textarea><input id="shift" type="number" value="3"><output id="result"></output> <script>    // Collez ici la fonction caesar     const text = document.querySelector("#text");    const shift = document.querySelector("#shift");    const result = document.querySelector("#result");     function update() {        result.textContent = caesar(text.value, Number(shift.value));    }     text.addEventListener("input", update);    shift.addEventListener("input", update);</script>

Deux détails comptent ici. La valeur d’un champ est toujours une chaîne : le décalage passe donc par Number(). Et le résultat s’écrit avec textContent, car innerHTML exécuterait tout HTML saisi dans le champ.

Un outil en ligne de commande avec Node.js

Remplacez les deux dernières lignes de caesar.js par ce code pour lire le décalage et le texte sur la ligne de commande :

const [shift, ...words] = process.argv.slice(2);console.log(caesar(words.join(" "), Number(shift))); // node caesar.js 3 Bonjour// Erqmrxu

Casser le code par force brute

Avec 26 lettres, il n’y a que 25 décalages à essayer, et une courte boucle suffit pour lire un message sans la clé. Cherchez dans la sortie la ligne qui a du sens :

function crack(text) {    for (let shift = 1; shift < 26; shift++) {        console.log(shift, caesar(text, -shift));    }} crack("Erqmrxu à wrxv !");// 1 Dqplqwt à vqwu !// 2 Cpokpvs à upvt !// 3 Bonjour à tous !// ...

L’article sur l’attaque par force brute va plus loin, et le casseur en ligne fait la même chose dans votre navigateur.

Une version plus courte avec replace

replace avec une expression régulière globale appelle votre fonction pour chaque lettre et laisse le reste intact. Plus besoin de boucle ni de else.

const caesar = (text, shift) =>    text.replace(/[a-z]/gi, (char) => {        const base = char <= "Z" ? 65 : 97;        const code = char.charCodeAt(0) - base;        return String.fromCharCode(((code + shift) % 26 + 26) % 26 + base);    });

Autres alphabets et chiffres

Pour décaler autre chose que A à Z, gardez l’alphabet dans une chaîne et cherchez chaque caractère avec indexOf(). Ici, l’alphabet comprend aussi les chiffres :

const ALPHABET = "abcdefghijklmnopqrstuvwxyz0123456789"; function caesarAlphabet(text, shift) {    const size = ALPHABET.length;    let result = "";    for (const char of text) {        const position = ALPHABET.indexOf(char.toLowerCase());        if (position === -1) {            result += char;        } else {            const next = ALPHABET[((position + shift) % size + size) % size];            result += char === char.toLowerCase() ? next : next.toUpperCase();        }    }    return result;} console.log(caesarAlphabet("Salle 101", 3));// Vdooh 434

Le retour au début dépend désormais de la longueur de l’alphabet, et il suffit de modifier la chaîne pour y ajouter é, è ou ç. Notre outil de chiffre de César propose aussi des alphabets tout prêts pour comparer les résultats.

Chiffrer un fichier texte

Avec Node.js, lire et écrire un fichier prend une ligne chacun. Ce code utilise import : nommez donc le fichier caesar.mjs ou indiquez "type": "module" dans package.json.

import { readFileSync, writeFileSync } from "node:fs"; const text = readFileSync("message.txt", "utf8");writeFileSync("encrypted.txt", caesar(text, 3));

Une librairie toute prête

Si vous avez besoin du chiffre dans un projet sans vouloir le maintenir, notre librairie caesar-cipher-js n’a aucune dépendance et inclut les types TypeScript. Installez-la avec npm install caesar-cipher-js :

import { encrypt, decrypt } from "caesar-cipher-js"; console.log(encrypt("Bonjour à tous !", 3));// Erqmrxu à wrxv !console.log(decrypt("Erqmrxu à wrxv !", 3));// Bonjour à tous !

Tester votre code

Node.js intègre un module d’assertions, et quelques lignes repèrent la plupart des bugs : dépassement du Z, respect de la casse, ponctuation conservée et retour au texte d’origine. Si tout va bien, le programme affiche OK.

import assert from "node:assert/strict"; assert.equal(caesar("ABC", 3), "DEF");assert.equal(caesar("xyz", 3), "abc");assert.equal(caesar("Hello, World!", 5), "Mjqqt, Btwqi!");assert.equal(caesar(caesar("JavaScript", 7), -7), "JavaScript");assert.equal(caesar("A", -27), "Z");assert.equal(caesar("é", 3), "é");console.log("OK");

Erreurs fréquentes

La plus courante consiste à laisser le décalage sous forme de chaîne : 7 + "3" donne "73", et le programme renvoie sans prévenir une mauvaise lettre. Vient ensuite % avec un décalage négatif, comme on l’a vu. Enfin, n’affichez pas le résultat avec innerHTML, puisque le texte vient de l’utilisateur.

Questions fréquentes

Est-ce que cela fonctionne dans tous les navigateurs ?

Oui, tous les navigateurs actuels prennent en charge la syntaxe utilisée ici. Nous avons exécuté le code de cette page sous Node.js 25 et testé la page web dans un navigateur.

Puis-je protéger de vraies données avec ce code ?

Non. La boucle ci-dessus le casse en quelques secondes. Gardez-le pour apprendre et pour les énigmes. Pour de vraies données, les navigateurs et Node.js offrent un chiffrement moderne avec la Web Crypto API.

Comment vérifier mon résultat ?

Saisissez le même texte et le même décalage dans notre outil de chiffre de César et comparez. Vous pouvez aussi appeler l’API REST gratuite depuis vos tests.