Manipulación de cadenas en formato título

Beginner

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

Introducción

En este laboratorio, exploraremos cómo convertir una cadena de texto a formato título usando JavaScript. Utilizaremos expresiones regulares para dividir la cadena en palabras y luego capitalizar la primera letra de cada palabra. Al final de este laboratorio, tendrás una mejor comprensión de cómo manipular cadenas de texto en JavaScript y aplicar esta técnica para formatear texto en tus aplicaciones web.

Función para convertir una cadena a formato título

Para convertir una cadena dada a formato título, utiliza la siguiente función. Utiliza String.prototype.match() para dividir la cadena en palabras utilizando una expresión regular adecuada. Luego las combina utilizando Array.prototype.map(), Array.prototype.slice(), Array.prototype.join() y String.prototype.toUpperCase(). Esto capitaliza la primera letra de cada palabra y agrega un espacio en blanco entre ellas.

const toTitleCase = (str) =>
  str
    .match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g)
    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
    .join(" ");

A continuación, se presentan algunos ejemplos de cómo utilizar la función:

toTitleCase("some_database_field_name"); // 'Some Database Field Name'
toTitleCase("Some label that needs to be title-cased");
// 'Some Label That Needs To Be Title Cased'
toTitleCase("some-package-name"); // 'Some Package Name'
toTitleCase("some-mixed_string with spaces_underscores-and-hyphens");
// 'Some Mixed String With Spaces Underscores And Hyphens'

Resumen

¡Felicitaciones! Has completado el laboratorio de convertir una cadena a formato título. Puedes practicar más laboratorios en LabEx para mejorar tus habilidades.