Snippets de Manipulação de String em JS: camelCase, Sanitização e Truncate

 

Aqui estão os snippets essenciais em JavaScript para as principais operações de manipulação, conversão e sanitização de texto do dia a dia.

1. Sanitização de Inputs (Remover Tags HTML e Scripts)

Remove qualquer tag HTML ou script perigoso de uma string para evitar ataques como XSS (Cross-Site Scripting) em entradas de texto simples.

JavaScript

function sanitizarInput(texto) {
  // Remove todas as tags HTML/XML (<script>, <b>, etc.)
  return texto.replace(/<[^>]*>?/gm, '');
}

// Exemplo de uso:
const entradaComScript = "<script>alert('XSS')</script><b>Texto limpo</b>";
console.log(sanitizarInput(entradaComScript)); // "alert('XSS')Texto limpo"

Pontos-chave:

• <[^>]*>?: Captura o caractere <, seguido por qualquer coisa que não seja >, até encontrar >.
  
  
• gm: As flags global e multiline garantem que todas as ocorrências na string sejam limpas, mesmo em textos com quebra de linha.
  
  

2. Conversão de Case (camelCase e snake_case)

Padroniza textos e nomes de variáveis vindos de formulários ou APIs para os formatos mais utilizados no desenvolvimento.

JavaScript

// Converte para camelCase (ex: "nome do usuario" -> "nomeDoUsuario")
function paraCamelCase(texto) {
  return texto
    .toLowerCase()
    .replace(/[^a-zA-Z0-9]+(.)/g, (match, chr) => chr.toUpperCase())
    .trim();
}

// Converte para snake_case (ex: "nome do usuario" -> "nome_do_usuario")
function paraSnakeCase(texto) {
  return texto
    .trim()
    .toLowerCase()
    .replace(/\s+/g, '_')
    .replace(/[^\w]/g, '');
}

// Exemplo de uso:
console.log(paraCamelCase("ciber dicas suporte ti")); // "ciberDicasSuporteTi"
console.log(paraSnakeCase("ciber dicas suporte ti")); // "ciber_dicas_suporte_ti"

Pontos-chave:

• [^a-zA-Z0-9]+(.): No camelCase, identifica caracteres especiais ou espaços seguidos por uma letra para transformá-la em maiúscula.
  
  
• /\s+/g: No snake_case, substitui sequências de um ou mais espaços por um único caractere de sublinhado (_).
  
  

3. Truncar Texto com Reticências

Corta um texto longo ao atingir um limite máximo de caracteres e adiciona reticências (...), mantendo a formatação visual consistente em cards e listagens.

JavaScript

function truncarTexto(texto, limite) {
  if (texto.length <= limite) return texto;
  return texto.slice(0, limite).trim() + '...';
}

// Exemplo de uso:
const resumo = "Manipulação de texto em JavaScript para otimização de interfaces web.";
console.log(truncarTexto(resumo, 30)); // "Manipulação de texto em JavaSc..."

Pontos-chave:

• texto.length <= limite: Evita adicionar reticências desnecessárias caso a string original seja menor que o limite.
  
  
• slice(0, limite).trim(): Extrai o pedaço do texto e remove eventuais espaços em branco que fiquem soltos no final antes de anexar o ....