¿Cómo capitalizar dinámicamente una palabra en JavaScript?

Como Capitalizar Dinamicamente Una Palabra En Javascript



El uso de mayúsculas de una palabra específica de una sola cadena es muy útil cuando el programador quiere desviar la atención del lector o del usuario final hacia información única o importante. La mayoría de las abreviaturas, notas, fechas, nombres de lugares o nombres de personas se escriben con mayúscula ya que ofrecen información importante. Al capitalizar varios beneficios se pueden lograr como una mejor accesibilidad, factores mejorados de visibilidad y legibilidad, participación de la interacción del usuario, etc.

Este blog ilustra el procedimiento para poner en mayúscula una palabra específica en JavaScript explicando los siguientes métodos:

¿Cómo capitalizar dinámicamente una palabra en JavaScript?

No hay ninguna propiedad integrada o método de JavaScript que se pueda usar para poner en mayúscula solo la primera palabra de la cadena proporcionada. Sin embargo, hay un par de enfoques que se pueden modificar para obtener los resultados deseados. Estos métodos se describen con su descripción de código. Procedamos.







Método 1: Usar el método “slice()”

En este método, el “ inmediato() ', y ' aMayúsculas() ” métodos se utilizan a lo largo de la “ rebanada() ” para poner en mayúscula solo la primera palabra o alguna parte de la cadena según sea necesario o especificado por el usuario. Como se muestra en el siguiente fragmento de código:



< cuerpo >

  < h1 > Artículo de LinuxHint h1 >
  < h4 > Poner en mayúscula la primera palabra h4 >
  < botón al hacer clic = 'captalizarPrimeraPalabra()' > Intentalo botón >
  < identificación p = 'objetivo' > pag >

< guion >
  función capitalizarPrimeraPalabra ( ) {
dejar datos = inmediato ( 'Por favor ingrese la cadena' , 'John Mecha' ) ;
  constante ÍndiceFinPalabra = inmediato ( 'Ingresar rango final' , '5' ) ;
let firstWord = datos. rebanada ( 0 , ÍndiceFinPalabra ) ;
dejar rem = datos. reemplazar ( primera palabra , '' ) ;
 
  si ( datos != nulo ) {
documento. getElementById ( 'objetivo' ) . HTML interno = 'La primera palabra ahora está en mayúscula: ' + primera palabra. aMayúsculas ( ) + movimiento rápido del ojo ;
  }
}
  guion >
cuerpo >

Explicación del código:



  • Primero, se declara el elemento del botón que llama al ' capitalizarPrimeraPalabra() ” método usando el “ al hacer clic ” oyente de eventos. El ' pag El elemento ” también se crea al tener una identificación de “ objetivo ”. En este elemento HTML 'p' se inserta la salida.
  • A continuación, la función “ capitalizarPrimeraPalabra() ” cuerpo se define dentro del “

    El resultado muestra que la primera palabra de la cadena proporcionada ahora está en mayúscula.



    Método 2: Usar el método “substr()”

    El ' substr() El método ” se puede usar para poner en mayúscula solo la primera palabra de la cadena proporcionada. Se puede hacer seleccionando solo la primera letra por separado accediendo al número de índice y aplicándole el método “toUpperCase()”. Luego, adjunte la parte restante de la cadena como se hace en el siguiente código:

    < h1 > Artículo de LinuxHint h1 >
    < h4 > Poner en mayúscula la primera palabra h4 >

      < botón al hacer clic = 'captalizarPrimeraPalabra()' > Intentalo botón >
      < identificación p = 'objetivo' > pag >

    < guion >
      función capitalizarPrimeraPalabra ( ) {
    dejar datos = inmediato ( 'Por favor ingrese la cadena' , 'John Mecha' )
      constante ÍndiceFinPalabra = inmediato ( 'Ingresar rango final' , '5' ) ;
    deja que resulte = datos. substr ( 0 , ÍndiceFinPalabra ) . aMayúsculas ( ) + datos. substr ( ÍndiceFinPalabra ) ;
    si ( datos != nulo ) {
    documento. getElementById ( 'objetivo' ) . HTML interno = 'La primera palabra ahora está en mayúsculas como: ' + resultado ;
      }
    }
    guion >

    Explicación del código anterior:

    • El código anterior es el mismo que se describe en el método anterior, solo el ' rebanada() ' y ' reemplazar() El método ” se reemplaza por “ substr() ' método.
    • El método “substr()” se aplica al “ datos ” variable y la parte de la cadena de la “ 0 El índice ” del índice proporcionado está separado. En esta parte separada que es la primera palabra, el “ aMayúsculas() Se aplica el método ” para capitalizarlo.
    • Después de eso, el segundo “ substr() El método ” se usa para seleccionar la parte restante del índice provisto y luego concatenar el resultado para ambos métodos.

    Después de la compilación:

    El resultado muestra que solo la primera palabra de la cadena se ha escrito en mayúscula

    Conclusión

    No hay ningún método integrado que se pueda usar para poner en mayúsculas solo la primera palabra de una cadena proporcionada dinámicamente. Sin embargo, el ' rebanada() ' y ' substr() Los métodos ” se pueden usar junto con la combinación de diferentes métodos, como “ inmediato() ”, “ reemplazar() ', y ' aMayúsculas() ” para poner en mayúscula la primera palabra. Aquí el ' aMayúsculas() El método ” pone específicamente en mayúsculas la primera palabra dividida. Esta publicación ha ilustrado los métodos para poner en mayúscula una palabra en JavaScript.