"Se um trabalhador quiser fazer bem o seu trabalho, ele deve primeiro afiar suas ferramentas." - Confúcio, "Os Analectos de Confúcio. Lu Linggong"
Primeira página > Programação > # Substitua a validação genérica por funções reutilizáveis

# Substitua a validação genérica por funções reutilizáveis

Publicado em 2024-11-06
Navegar:389

# Replace Generic Validation with Reusable Functions

Os desenvolvedores de JavaScript e TypeScript geralmente se encontram escrevendo as mesmas condições repetidamente. Se você é um desenvolvedor web, provavelmente já encontrou códigos como este:

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

Neste caso, event.key é do tipo string, e é fácil introduzir bugs incluindo acidentalmente um espaço em 'Enter', por exemplo.

Por que não encapsular esta condição em uma função?

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

Isso garante que todas as verificações da tecla Enter sejam consistentes e confiáveis.

Agora, considere esta validação:

type Value = null | object;

const value = {} as Value;

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

Mesmo que o TypeScript seja inteligente, o valor dentro da condição permanece do tipo Value. Isso ocorre porque typeof null retorna 'objeto'.

Então, você precisa escrever:

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

Muitos desenvolvedores podem não encapsular isso em uma função e, em vez disso, escrevê-lo repetidamente sempre que se deparam com essa situação.

Quantas vezes você escreveu a mesma condição em sua vida?

Quantas vezes você cometeu o mesmo erro?

Quantas vezes mais você escreverá a mesma condição no futuro?

Se fosse eu, eu faria isso:

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

Há muitos benefícios em encapsular condições genéricas em funções.

Considere o seguinte exemplo:

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

Vamos criar um array que exclui apenas valores nulos.

Você pode priorizar a brevidade e escrever assim:

const numbers = array.filter(Boolean);

Infelizmente, isso não é o ideal. 0 também é avaliado como falso e é excluído. Então você precisa escrever:

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

Isso não parece um código feio e não reutilizável?

Posso escrever um código mais elegante:

const numbers = array.filter(checkIsNullish);

Pare de escrever condições genéricas repetidamente. Isso só leva a erros e o código se torna menos legível.

Deixe-me apresentar uma biblioteca que criei chamada checker.

Esta biblioteca de funções utilitárias representa condições comumente usadas no desenvolvimento web geral e no desenvolvimento de baixo nível como funções. Todas as funções recebem uma entrada e retornam um valor booleano.

No momento em que escrevo este artigo, ele fornece uma variedade de funções para lidar com tipos de dados como strings, números, booleanos e valores nulos. Todas as funções são testadas, documentadas e fáceis de usar.

Vejamos alguns exemplos do mundo real.

Os pacotes fornecidos por esta biblioteca são todos publicados em JSR. Eles podem ser facilmente instalados em projetos NPM, PNPM, Yarn, Bun e Deno.

Aqui, tomaremos o pacote @checker/string como exemplo com NPM.

  1. Instale o pacote

Execute o seguinte comando no diretório do seu projeto:

  npx jsr add @checker/string
  1. Usando as funções
  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
  }

Não gosto de usar operadores de negação lógica como !SOME_CONDITION para reverter um valor booleano. Isso ocorre porque está implícito e simplesmente reverter o valor booleano adicionando ou omitindo-o pode levar a muitas situações perigosas.

Portanto, todas as funções têm funções checkIsNot~ correspondentes definidas.

Encapsular condições genéricas em funções. Dessa forma, o código fica mais legível e os bugs ficam mais fáceis de detectar.

Obrigado por ler.

Declaração de lançamento Este artigo foi reproduzido em: https://dev.to/cat394/-replace-generic-validation-with-reusable-functions-3nec?1 Se houver alguma violação, entre em contato com [email protected] para excluí-la
Tutorial mais recente Mais>

Isenção de responsabilidade: Todos os recursos fornecidos são parcialmente provenientes da Internet. Se houver qualquer violação de seus direitos autorais ou outros direitos e interesses, explique os motivos detalhados e forneça prova de direitos autorais ou direitos e interesses e envie-a para o e-mail: [email protected]. Nós cuidaremos disso para você o mais rápido possível.

Copyright© 2022 湘ICP备2022001581号-3