Converter String para Pascal Case

Beginner

This tutorial is from open-source community. Access the source code

Introdução

Neste laboratório, aprenderemos como converter strings para Pascal case usando JavaScript. Pascal case é uma convenção de nomenclatura comumente usada em programação, onde cada palavra em uma palavra composta começa com uma letra maiúscula, sem espaços ou separadores entre as palavras. Por exemplo, "hello world" torna-se "HelloWorld" em Pascal case.

Ao longo deste laboratório, exploraremos vários métodos de manipulação de strings em JavaScript e expressões regulares para criar uma função robusta que pode converter qualquer string para Pascal case, independentemente de seu formato original.

Compreendendo Pascal Case e Configurando o Ambiente

Pascal case é uma convenção de nomenclatura onde:

  • A primeira letra de cada palavra é capitalizada
  • Não são usados espaços, hífens ou underscores entre as palavras
  • Todas as outras letras são minúsculas

Por exemplo:

  • "hello world" → "HelloWorld"
  • "user_name" → "UserName"
  • "first-name" → "FirstName"

Vamos começar configurando nosso ambiente de desenvolvimento.

  1. Abra o Terminal da interface WebIDE clicando em "Terminal" na barra de menu superior.

  2. Inicie uma sessão interativa do Node.js digitando o seguinte comando no Terminal e pressionando Enter:

node

Você deve ver o prompt do Node.js (>) aparecer, indicando que você está agora no ambiente interativo do Node.js.

  1. Vamos tentar uma manipulação simples de string para aquecer. Digite o seguinte código no prompt do Node.js:
let name = "john doe";
let capitalizedFirstLetter = name.charAt(0).toUpperCase() + name.slice(1);
console.log(capitalizedFirstLetter);

A saída deve ser:

John doe

Este exemplo simples demonstra como capitalizar a primeira letra de uma string. Usamos:

  • charAt(0) para obter o primeiro caractere
  • toUpperCase() para convertê-lo para maiúsculas
  • slice(1) para obter o restante da string
  • Concatenação com + para combiná-los

Esses métodos de string serão úteis à medida que construímos nosso conversor para Pascal case.

Trabalhando com Expressões Regulares para Separação de Palavras

Para converter uma string para Pascal case, o primeiro passo é dividir a string em palavras individuais. Podemos usar expressões regulares (regex) para identificar limites de palavras, independentemente do delimitador usado (espaços, hífens, underscores, etc.).

Em JavaScript, as expressões regulares são delimitadas por barras (/pattern/). Vamos explorar como usar regex para dividir uma string em palavras.

  1. Em sua sessão do Node.js, vamos tentar um exemplo simples primeiro. Digite o seguinte código:
let str = "hello_world-example";
let words = str.split(/[-_]/);
console.log(words);

A saída deve ser:

[ 'hello', 'world', 'example' ]

Esta regex /[-_]/ corresponde a um hífen ou um underscore, e split() usa essas correspondências como separadores.

  1. Agora, vamos tentar uma string e regex mais complexas. Digite:
let complexStr = "hello_WORLD-example phrase";
let regex =
  /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g;
let matches = complexStr.match(regex);
console.log(matches);

A saída deve ser:

[ 'hello', 'WORLD', 'example', 'phrase' ]

Vamos detalhar esta regex:

  • /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)/: Corresponde a sequências de letras maiúsculas
  • /[A-Z]?[a-z]+[0-9]*/: Corresponde a palavras que podem começar com uma letra maiúscula
  • /[A-Z]/: Corresponde a letras maiúsculas únicas
  • /[0-9]+/: Corresponde a sequências de números
  • A flag g torna a correspondência global (encontra todas as correspondências)

O método match() retorna um array de todas as correspondências encontradas na string. Isso será essencial para nosso conversor para Pascal case, pois ele pode identificar palavras em quase qualquer formato.

Capitalizando Cada Palavra

Agora que podemos dividir uma string em palavras, precisamos capitalizar a primeira letra de cada palavra e colocar o restante em minúsculas. Vamos implementar essa funcionalidade.

  1. Em sua sessão do Node.js, vamos escrever uma função para capitalizar uma única palavra. Digite:
function capitalizeWord(word) {
  return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
}

// Teste com alguns exemplos
console.log(capitalizeWord("hello"));
console.log(capitalizeWord("WORLD"));
console.log(capitalizeWord("javaScript"));

A saída deve ser:

Hello
World
Javascript
  1. Agora, vamos aplicar esta função a um array de palavras usando o método map(). Digite:
let words = ["hello", "WORLD", "javaScript"];
let capitalizedWords = words.map((word) => capitalizeWord(word));
console.log(capitalizedWords);

A saída deve ser:

[ 'Hello', 'World', 'Javascript' ]

O método map() cria um novo array aplicando uma função a cada elemento do array original. Neste caso, estamos aplicando nossa função capitalizeWord a cada palavra.

  1. Finalmente, vamos juntar as palavras capitalizadas para formar uma string Pascal case:
let pascalCase = capitalizedWords.join("");
console.log(pascalCase);

A saída deve ser:

HelloWorldJavascript

O método join("") combina todos os elementos de um array em uma única string, usando o delimitador fornecido (uma string vazia neste caso) entre cada elemento.

Esses passos demonstram o processo principal de conversão de uma string para Pascal case:

  1. Dividir a string em palavras
  2. Capitalizar cada palavra
  3. Juntar as palavras sem nenhum separador

Criando a Função toPascalCase Completa

Agora que entendemos todos os componentes necessários, vamos criar uma função toPascalCase completa que pode lidar com qualquer string de entrada.

  1. Vamos criar um arquivo JavaScript para salvar nossa função. Saia da sua sessão do Node.js pressionando Ctrl+C duas vezes ou digitando .exit.

  2. No WebIDE, crie um novo arquivo clicando em "File" > "New File" no menu superior.

  3. Salve o arquivo como pascalCase.js no diretório /home/labex/project.

  4. Copie e cole o seguinte código no editor:

/**
 * Converte uma string para Pascal case.
 * @param {string} str - A string de entrada para converter.
 * @returns {string} A string em Pascal case.
 */
function toPascalCase(str) {
  // Use regex para encontrar palavras, independentemente do delimitador
  const words = str.match(
    /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
  );

  // Se nenhuma palavra for encontrada, retorne uma string vazia
  if (!words) {
    return "";
  }

  // Capitalize cada palavra e junte-as
  return words
    .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
    .join("");
}

// Casos de teste
console.log(toPascalCase("hello world")); // "HelloWorld"
console.log(toPascalCase("some_database_field_name")); // "SomeDatabaseFieldName"
console.log(toPascalCase("Some label that needs to be pascalized")); // "SomeLabelThatNeedsToBePascalized"
console.log(toPascalCase("some-javascript-property")); // "SomeJavascriptProperty"
console.log(
  toPascalCase("some-mixed_string with spaces_underscores-and-hyphens")
); // "SomeMixedStringWithSpacesUnderscoresAndHyphens"
  1. Salve o arquivo pressionando Ctrl+S ou selecionando "File" > "Save" no menu.

  2. Execute o arquivo usando Node.js abrindo o Terminal e digitando:

node pascalCase.js

Você deve ver a seguinte saída:

HelloWorld
SomeDatabaseFieldName
SomeLabelThatNeedsToBePascalized
SomeJavascriptProperty
SomeMixedStringWithSpacesUnderscoresAndHyphens

Nossa função toPascalCase agora está funcionando corretamente. Vamos revisar como ela funciona:

  1. Usamos uma expressão regular para encontrar palavras na string de entrada, independentemente dos delimitadores usados.
  2. Verificamos se alguma palavra foi encontrada. Caso contrário, retornamos uma string vazia.
  3. Usamos map() para capitalizar cada palavra e join('') para combiná-las sem separadores.
  4. O resultado é uma string em Pascal case, onde cada palavra começa com uma letra maiúscula e o restante é minúsculo.

Aprimorando e Usando a Função Pascal Case

Agora que temos uma função toPascalCase funcional, vamos aprimorá-la com recursos adicionais e aprender como usá-la de forma prática.

  1. Abra seu arquivo pascalCase.js no WebIDE.

  2. Vamos modificar a função para lidar melhor com casos extremos. Substitua o código existente por:

/**
 * Converte uma string para Pascal case.
 * @param {string} str - A string de entrada para converter.
 * @returns {string} A string em Pascal case.
 */
function toPascalCase(str) {
  // Lidar com casos extremos
  if (!str) return "";
  if (typeof str !== "string") return "";

  // Use regex para encontrar palavras, independentemente do delimitador
  const words = str.match(
    /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
  );

  // Se nenhuma palavra for encontrada, retorne uma string vazia
  if (!words) {
    return "";
  }

  // Capitalize cada palavra e junte-as
  return words
    .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
    .join("");
}

// Casos de teste, incluindo casos extremos
console.log(toPascalCase("hello world")); // "HelloWorld"
console.log(toPascalCase("")); // ""
console.log(toPascalCase(null)); // ""
console.log(toPascalCase("123_abc")); // "123Abc"
console.log(toPascalCase("UPPER_CASE_EXAMPLE")); // "UpperCaseExample"
console.log(
  toPascalCase("some-mixed_string with spaces_underscores-and-hyphens")
); // "SomeMixedStringWithSpacesUnderscoresAndHyphens"

// Criar um módulo utilitário reutilizável
module.exports = { toPascalCase };
  1. Salve o arquivo pressionando Ctrl+S.

  2. Agora, vamos criar um novo arquivo para demonstrar como usar nossa função como um utilitário em outro arquivo. Crie um novo arquivo clicando em "File" > "New File" no menu superior.

  3. Salve este arquivo como useCase.js no diretório /home/labex/project.

  4. Adicione o seguinte código a useCase.js:

// Importar a função toPascalCase do nosso arquivo utilitário
const { toPascalCase } = require("./pascalCase");

// Exemplo: Convertendo nomes de campos de banco de dados para nomes de variáveis JavaScript
const databaseFields = [
  "user_id",
  "first_name",
  "last_name",
  "email_address",
  "date_of_birth"
];

// Converter cada nome de campo para Pascal case
const javaScriptVariables = databaseFields.map((field) => toPascalCase(field));

// Exibir os resultados
console.log("Database Fields:");
console.log(databaseFields);
console.log("\nJavaScript Variables (Pascal Case):");
console.log(javaScriptVariables);

// Exemplo: Criando um nome de classe a partir de uma descrição
const description = "user account manager";
const className = toPascalCase(description);
console.log(`\nClass name created from "${description}": ${className}`);
  1. Salve o arquivo pressionando Ctrl+S.

  2. Execute o novo arquivo usando Node.js. No Terminal, digite:

node useCase.js

Você deve ver uma saída semelhante a:

Database Fields:
[ 'user_id', 'first_name', 'last_name', 'email_address', 'date_of_birth' ]

JavaScript Variables (Pascal Case):
[ 'UserId', 'FirstName', 'LastName', 'EmailAddress', 'DateOfBirth' ]

Class name created from "user account manager": UserAccountManager

Isso demonstra um uso prático da função toPascalCase para converter nomes de campos de banco de dados em nomes de variáveis JavaScript e criar nomes de classes a partir de descrições.

Observe que também adicionamos:

  1. Tratamento de erros para entradas nulas, indefinidas ou não strings
  2. Exportações de módulo para que a função possa ser importada em outros arquivos
  3. Um exemplo do mundo real de como usar a função

Essas melhorias tornam nossa função toPascalCase mais robusta e utilizável em aplicações JavaScript reais.

Resumo

Neste laboratório, você aprendeu como converter strings para Pascal case em JavaScript. Aqui está o que você realizou:

  1. Entendeu o conceito de Pascal case e suas aplicações em programação
  2. Aprendeu como usar expressões regulares para dividir strings em palavras, independentemente dos delimitadores
  3. Aplicou métodos de manipulação de strings como charAt(), slice(), toUpperCase() e toLowerCase()
  4. Criou uma função toPascalCase robusta que lida com vários formatos de entrada
  5. Aprimorou a função com tratamento de erros e a exportou como um módulo
  6. Aplicou a função a casos de uso práticos, como converter nomes de campos de banco de dados em variáveis JavaScript

Essas habilidades são úteis em muitos cenários de programação, como:

  • Converter entre diferentes convenções de nomenclatura
  • Processar a entrada do usuário em formatos padronizados
  • Trabalhar com dados de diferentes fontes
  • Criar nomenclatura consistente em seu código

Você pode continuar a desenvolver essas habilidades explorando outras técnicas de manipulação de strings e aplicando-as aos seus próprios projetos.