Vérification si une chaîne est alphanumérique

Introduction

Dans ce laboratoire (lab), nous allons apprendre à vérifier si une chaîne de caractères ne contient que des caractères alphanumériques à l'aide de JavaScript. Les caractères alphanumériques incluent les lettres (A-Z, a-z) et les chiffres (0-9). Il s'agit d'une tâche courante dans la validation de formulaires, le traitement de données et de nombreux autres scénarios de programmation.

Nous allons créer une fonction JavaScript qui utilise des expressions régulières pour déterminer si une chaîne de caractères est alphanumérique. À la fin de ce laboratoire, vous comprendrez comment implémenter cette vérification et comment les expressions régulières peuvent être utilisées pour valider les modèles de chaînes de caractères en JavaScript.

Skills Graph

Comprendre les caractères alphanumériques

Les caractères alphanumériques sont composés des 26 lettres de l'alphabet anglais (en majuscules de A à Z et en minuscules de a à z) et des 10 chiffres numériques (de 0 à 9). Lorsque nous vérifions si une chaîne de caractères est alphanumérique, nous vérifions qu'elle ne contient que ces caractères et rien d'autre.

En JavaScript, nous pouvons vérifier les caractères alphanumériques à l'aide d'expressions régulières. Les expressions régulières (regex) sont des modèles utilisés pour correspondre à des combinaisons de caractères dans les chaînes de caractères.

Commençons par ouvrir notre éditeur de code. Dans le WebIDE, accédez à l'explorateur de fichiers sur le côté gauche et créez un nouveau fichier JavaScript :

1. Cliquez avec le bouton droit dans le panneau de l'explorateur de fichiers
2. Sélectionnez "Nouveau fichier"
3. Nommez le fichier alphanumeric.js

Une fois que vous avez créé le fichier, il devrait s'ouvrir automatiquement dans l'éditeur. Sinon, cliquez sur alphanumeric.js dans l'explorateur de fichiers pour l'ouvrir.

Maintenant, entrons le code suivant :

// Function to check if a string is alphanumeric
function isAlphaNumeric(str) {
  // Using regular expression to check for alphanumeric characters
  return /^[a-zA-Z0-9]+$/.test(str);
}

// Example usage
console.log("Is 'hello123' alphanumeric?", isAlphaNumeric("hello123"));
console.log("Is '123' alphanumeric?", isAlphaNumeric("123"));
console.log("Is 'hello 123' alphanumeric?", isAlphaNumeric("hello 123"));
console.log("Is 'hello@123' alphanumeric?", isAlphaNumeric("hello@123"));

Enregistrez le fichier en appuyant sur Ctrl+S ou en sélectionnant "Fichier" > "Enregistrer" dans le menu.

Maintenant, exécutons ce fichier JavaScript pour voir la sortie. Ouvrez le terminal dans le WebIDE en sélectionnant "Terminal" > "Nouveau terminal" dans le menu ou en appuyant sur Ctrl+`.

Dans le terminal, exécutez la commande suivante :

node alphanumeric.js

Vous devriez voir la sortie suivante :

Is 'hello123' alphanumeric? true
Is '123' alphanumeric? true
Is 'hello 123' alphanumeric? false
Is 'hello@123' alphanumeric? false

Cette sortie montre que notre fonction identifie correctement hello123 et 123 comme des chaînes de caractères alphanumériques, tandis que hello 123 (contient un espace) et hello@123 (contient un caractère spécial @) ne sont pas alphanumériques.

Comprendre les expressions régulières

Maintenant, examinons l'expression régulière que nous avons utilisée dans notre fonction :

/^[a-zA-Z0-9]+$/;

Ce modèle peut sembler complexe, mais nous pouvons le décomposer en parties :

1. / - Les barres obliques marquent le début et la fin du modèle d'expression régulière.
2. ^ - Ce symbole signifie "début de la chaîne de caractères".
3. [a-zA-Z0-9] - Il s'agit d'une classe de caractères qui correspond à :
   • a-z : n'importe quelle lettre minuscule de 'a' à 'z'
   • A-Z : n'importe quelle lettre majuscule de 'A' à 'Z'
   • 0-9 : n'importe quel chiffre de '0' à '9'
4. + - Ce quantificateur signifie "un ou plusieurs" de l'élément précédent.
5. $ - Ce symbole signifie "fin de la chaîne de caractères".

Donc, le modèle complet vérifie si la chaîne de caractères ne contient que des caractères alphanumériques du début à la fin.

Modifions notre fonction pour la rendre plus flexible. Ouvrez à nouveau le fichier alphanumeric.js et mettez-le à jour avec le code suivant :

// Function to check if a string is alphanumeric
function isAlphaNumeric(str) {
  return /^[a-zA-Z0-9]+$/.test(str);
}

// Alternative function using case-insensitive flag
function isAlphaNumericAlt(str) {
  return /^[a-z0-9]+$/i.test(str);
}

// Example usage
console.log("Using first function:");
console.log("Is 'Hello123' alphanumeric?", isAlphaNumeric("Hello123"));
console.log("Is 'HELLO123' alphanumeric?", isAlphaNumeric("HELLO123"));

console.log("\nUsing alternative function with case-insensitive flag:");
console.log("Is 'Hello123' alphanumeric?", isAlphaNumericAlt("Hello123"));
console.log("Is 'HELLO123' alphanumeric?", isAlphaNumericAlt("HELLO123"));

Enregistrez le fichier et exécutez-le à nouveau avec :

node alphanumeric.js

Vous devriez voir la sortie suivante :

Using first function:
Is 'Hello123' alphanumeric? true
Is 'HELLO123' alphanumeric? true

Using alternative function with case-insensitive flag:
Is 'Hello123' alphanumeric? true
Is 'HELLO123' alphanumeric? true

La fonction alternative utilise le marqueur i à la fin de l'expression régulière, ce qui rend la correspondance de modèle insensible à la casse. Cela signifie que nous n'avons besoin d'inclure que a-z dans notre classe de caractères, et elle correspondra automatiquement aux lettres majuscules également.

Création d'un outil de validation simple

Maintenant que nous comprenons la fonction de vérification alphanumérique, construisons un outil de validation interactif simple. Nous utiliserons le module readline intégré à Node.js pour obtenir les entrées de l'utilisateur depuis le terminal.

Créez un nouveau fichier nommé validator.js dans le même répertoire :

1. Cliquez avec le bouton droit dans le panneau de l'explorateur de fichiers
2. Sélectionnez "Nouveau fichier"
3. Nommez le fichier validator.js

Ajoutez le code suivant au fichier :

const readline = require("readline");

// Create a readline interface for user input
const rl = readline.createInterface({
  input: process.stdin,
  output: process.stdout
});

// Function to check if a string is alphanumeric
function isAlphaNumeric(str) {
  return /^[a-zA-Z0-9]+$/.test(str);
}

// Function to check the input
function checkInput(input) {
  if (isAlphaNumeric(input)) {
    console.log(`"${input}" is alphanumeric.`);
  } else {
    console.log(`"${input}" is NOT alphanumeric.`);
    console.log(
      "Alphanumeric strings contain only letters (A-Z, a-z) and numbers (0-9)."
    );
  }

  // Ask if the user wants to check another string
  rl.question("\nDo you want to check another string? (yes/no): ", (answer) => {
    if (answer.toLowerCase() === "yes" || answer.toLowerCase() === "y") {
      askForInput();
    } else {
      console.log("Thank you for using the alphanumeric validator!");
      rl.close();
    }
  });
}

// Function to ask for input
function askForInput() {
  rl.question("Enter a string to check if it is alphanumeric: ", (input) => {
    checkInput(input);
  });
}

// Welcome message
console.log("=== Alphanumeric String Validator ===");
console.log(
  "This tool checks if a string contains only alphanumeric characters (A-Z, a-z, 0-9).\n"
);

// Start the program
askForInput();

Enregistrez le fichier et exécutez-le avec :

node validator.js

Vous verrez un message de bienvenue et une invite vous demandant d'entrer une chaîne de caractères. Essayez d'entrer différentes chaînes, telles que :

• hello123 (alphanumérique)
• Hello World (non alphanumérique en raison de l'espace)
• hello@123 (non alphanumérique en raison du symbole @)

Pour chaque entrée, le programme vous indiquera si elle est alphanumérique et vous demandera si vous souhaitez vérifier une autre chaîne. Tapez yes ou y pour continuer, ou toute autre réponse pour quitter le programme.

Cet outil interactif montre comment notre fonction de validation alphanumérique peut être utilisée dans une application pratique.

Exploration d'autres méthodes pour vérifier les chaînes de caractères alphanumériques

En plus d'utiliser les expressions régulières, il existe d'autres méthodes pour vérifier si une chaîne de caractères est alphanumérique. Explorons-en quelques-unes en créant un nouveau fichier nommé alternative-methods.js :

1. Cliquez avec le bouton droit dans le panneau de l'explorateur de fichiers
2. Sélectionnez "Nouveau fichier"
3. Nommez le fichier alternative-methods.js

Ajoutez le code suivant au fichier :

// Method 1: Using regular expression (our original method)
function isAlphaNumericRegex(str) {
  return /^[a-zA-Z0-9]+$/.test(str);
}

// Method 2: Using Array.every() and checking each character
function isAlphaNumericEvery(str) {
  // If string is empty, return false
  if (str.length === 0) return false;

  return [...str].every((char) => {
    const code = char.charCodeAt(0);
    // Check if character is a digit (0-9)
    const isDigit = code >= 48 && code <= 57;
    // Check if character is a lowercase letter (a-z)
    const isLowercase = code >= 97 && code <= 122;
    // Check if character is an uppercase letter (A-Z)
    const isUppercase = code >= 65 && code <= 90;

    return isDigit || isLowercase || isUppercase;
  });
}

// Method 3: Using a combination of match() and length
function isAlphaNumericMatch(str) {
  // If string is empty, return false
  if (str.length === 0) return false;

  // Remove all alphanumeric characters and check if anything remains
  const nonAlphaNumeric = str.match(/[^a-zA-Z0-9]/g);
  return nonAlphaNumeric === null;
}

// Test strings
const testStrings = [
  "hello123",
  "HELLO123",
  "hello 123",
  "hello@123",
  "",
  "0123456789",
  "abcdefghijklmnopqrstuvwxyz"
];

// Test each method with each string
console.log("=== Testing Different Methods ===");
console.log("String\t\t\tRegex\tEvery\tMatch");
console.log("---------------------------------------------");

testStrings.forEach((str) => {
  const displayStr = str.length > 10 ? str.substring(0, 10) + "..." : str;
  const paddedStr = displayStr.padEnd(16, " ");

  const regexResult = isAlphaNumericRegex(str);
  const everyResult = isAlphaNumericEvery(str);
  const matchResult = isAlphaNumericMatch(str);

  console.log(`"${paddedStr}"\t${regexResult}\t${everyResult}\t${matchResult}`);
});

console.log("\nPerformance Comparison:");
const iterations = 1000000;
const testString = "hello123ABCxyz45";

console.time("Regex Method");
for (let i = 0; i < iterations; i++) {
  isAlphaNumericRegex(testString);
}
console.timeEnd("Regex Method");

console.time("Every Method");
for (let i = 0; i < iterations; i++) {
  isAlphaNumericEvery(testString);
}
console.timeEnd("Every Method");

console.time("Match Method");
for (let i = 0; i < iterations; i++) {
  isAlphaNumericMatch(testString);
}
console.timeEnd("Match Method");

Enregistrez le fichier et exécutez-le avec :

node alternative-methods.js

La sortie affichera comment chaque méthode se comporte avec différentes chaînes de test et une comparaison des performances entre les méthodes. La méthode utilisant les expressions régulières est généralement la plus concise et souvent la plus rapide, mais il est utile de comprendre les approches alternatives.

Examinons chaque méthode :

1. isAlphaNumericRegex : Utilise une expression régulière pour ne correspondre qu'aux caractères alphanumériques.
2. isAlphaNumericEvery : Vérifie le code ASCII de chaque caractère pour déterminer s'il est alphanumérique.
3. isAlphaNumericMatch : Supprime tous les caractères alphanumériques et vérifie s'il reste quelque chose.

Comprendre différentes approches vous offre de la flexibilité lors de la résolution de problèmes de programmation. Les expressions régulières sont puissantes mais peuvent parfois être difficiles à lire. Les autres méthodes peuvent être plus intuitives pour certains programmeurs, en particulier ceux qui ne sont pas familiers avec les motifs d'expressions régulières.

Résumé

Dans ce laboratoire, nous avons exploré comment vérifier si une chaîne de caractères ne contient que des caractères alphanumériques en JavaScript. Nous avons appris plusieurs concepts clés :

1. Quels sont les caractères alphanumériques (lettres de A à Z, de a à z et chiffres de 0 à 9)
2. Comment utiliser les expressions régulières pour valider les motifs de chaînes de caractères
3. Découper et comprendre les motifs d'expressions régulières comme /^[a-zA-Z0-9]+$/
4. Créer un outil de validation interactif en utilisant Node.js
5. Explorer des méthodes alternatives pour vérifier les chaînes de caractères alphanumériques

La capacité à valider le contenu des chaînes de caractères est une compétence fondamentale en programmation, utile pour :

• La validation de formulaires dans les applications web
• Le nettoyage et le traitement des données
• Les vérifications de sécurité pour prévenir les attaques d'injection
• La validation des noms de fichiers ou des entrées utilisateur

Vous pouvez étendre ce que vous avez appris en :

• Ajoutant plus de règles de validation (par exemple, longueur minimale, exigences de caractères spéciaux)
• Créant une bibliothèque de validation plus complète
• Intégrant ces fonctions de validation dans une application web

L'approche utilisant les expressions régulières que nous avons utilisée est concise et efficace, mais n'oubliez pas que comprendre les alternatives vous offre plus d'outils dans votre boîte à outils de programmation.