# Remplacer la validation générique par des fonctions réutilisables

Les développeurs JavaScript et TypeScript se retrouvent souvent à écrire les mêmes conditions à plusieurs reprises. Si vous êtes un développeur Web, vous avez probablement rencontré du code comme celui-ci :

const handleSaveTextKeydown = (event: KeyboardEvent) => {
   if (event.key === 'Enter') {
    //... save text
   }
}

Dans ce cas, event.key est de type string, et il est facile d'introduire des bugs en incluant accidentellement un espace dans 'Entrée', par exemple.

Pourquoi ne pas encapsuler cette condition dans une fonction ?

const handleSaveTextKeydown = (event: KeyboardEvent) => {
   if (checkIsEnterKey(event.key)) {
    //... save text
   }
}

Cela garantit que toutes les vérifications de la touche Entrée sont cohérentes et fiables.

Maintenant, considérez cette validation :

type Value = null | object;

const value = {} as Value;

if (typeof value === 'object') {
  value; // value type is null | object
}

Même si TypeScript est intelligent, la valeur à l'intérieur de la condition reste de type Value. En effet, typeof null renvoie « objet ».

Donc, vous devez écrire :

if (value !== null && typeof value === 'object') {
  value; // value type is object
}

De nombreux développeurs pourraient ne pas encapsuler cela dans une fonction et l'écrire à plusieurs reprises chaque fois qu'ils rencontrent cette situation.

Combien de fois avez-vous écrit la même condition dans votre vie ?

Combien de fois avez-vous commis la même erreur ?

Combien de fois écrivez-vous encore la même condition à l’avenir ?

Si c'était moi, je ferais ça :

if (checkIsObject(value)) {
  value; // value type is object
}

Il y a de nombreux avantages à encapsuler des conditions génériques dans des fonctions.

Considérons l'exemple suivant :

const array = [0, 1, 2, 3, 4, 5, null, undefined];

Créons un tableau qui exclut uniquement les valeurs nulles.

Vous pouvez privilégier la brièveté et l'écrire comme ceci :

const numbers = array.filter(Boolean);

Malheureusement, ce n’est pas idéal. 0 est également évalué comme faux et est exclu. Vous devez donc écrire :

const numbers = array.filter(item => item !== null && item !== undefined);

Cela ne ressemble-t-il pas à un code moche et non réutilisable ?

Je peux écrire du code plus élégant :

const numbers = array.filter(checkIsNullish);

Arrêtez d'écrire des conditions génériques à plusieurs reprises. Cela ne conduit qu'à des erreurs et le code devient moins lisible.

Permettez-moi de vous présenter une bibliothèque que j'ai créée appelée checker.

Cette bibliothèque de fonctions utilitaires représente les conditions couramment utilisées dans le développement Web général et le développement de bas niveau sous forme de fonctions. Toutes les fonctions prennent une entrée et renvoient une valeur booléenne.

Au moment de la rédaction de cet article, il fournit une multitude de fonctions pour gérer les types de données tels que les chaînes, les nombres, les booléens et les valeurs nulles. Toutes les fonctions sont testées, documentées et faciles à utiliser.

Regardons quelques exemples concrets.

Les packages fournis par cette bibliothèque sont tous publiés sur JSR. Ils peuvent être facilement installés dans les projets NPM, PNPM, Yarn, Bun et Deno.

Ici, nous prendrons le package @checker/string comme exemple avec NPM.

1. Installer le package

Exécutez la commande suivante dans le répertoire de votre projet :

  npx jsr add @checker/string

1. Utiliser les fonctions

  import { checkIsNotEmptyString, checkIsIndexFound } from "@checker/string";

  const value = "Hello";

  const formatted = value.trim();

  if (checkIsNotEmptyString(formatted)) {
    // formatted !== ''
    // When formatted is not an empty string
  }

  const index = value.indexOf("el");

  if (checkIsIndexFound(index)) {
    // index !== -1
    // When "el" is found in value
  }

Je n'aime pas utiliser des opérateurs de négation logique comme !SOME_CONDITION pour inverser une valeur booléenne. En effet, c'est implicite et le simple fait d'inverser la valeur booléenne en l'ajoutant ou en l'omettant peut conduire à de nombreuses situations dangereuses.

Par conséquent, toutes les fonctions ont des fonctions checkIsNot~ correspondantes définies.

Encapsuler les conditions génériques dans des fonctions. De cette façon, le code devient plus lisible et les bugs plus faciles à repérer.

Merci d'avoir lu.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!