Cadenas de escape: cómo poner tildes en Javascript

Generalmente, cuando trabajamos con Javascript nos encontramos con que tenemos problemas a la hora de representar tildes o caracteres especiales en nuestras aplicaciones.

Por ejemplo, es frecuente que tengamos que mostrar un alert manteniendo el formato original del texto, esto puede ser, con tildes, eñes o saltos de línea:

alert( ' Contraseña errónea ' );

Dependiendo de la codificación de caracteres, el texto puede aparecer mal formateado:

Texto mal formateado

Para evitar estos errores, recurrimos al estándar UNICODE, una codificación diseñada para facilitar la visualización de documentos en múltiples lenguajes preservando sus grafías y caracteres originales.

La siguiente tabla muestra aquellos caracteres más utilizados en castellano:

Tabla básica para caracteres Unicode

Para introducir estos caracteres en nuestros scripts, tenemos que recurrir a la cadena de escape ‘\u’ seguida de su correspondiente código. Así, nuestro ejemplo anterior quedaría como sigue:

alert( ' Contrase\u00F1a err\u00F3nea ' );

El resultado si corresponde con lo esperado:

Representación correcta de caracteres UNICODE

Para el resto de caracteres especiales, como los saltos de línea o las tabulaciones, recurrimos al siguiente resumen:

* \n: Salto de linea.
* \r: Retorno de carro.
* \t: Tabulación horizontal.
* \v: Tabulación vertical.
* \’: Comilla simple o apostrofe.
* \”: Comilla doble.
* \\: Barra invertida.

Para utilizarlos, solo hace falta escribirlos tal cual. Así, para conseguir un mensaje con un salto de línea, escribiríamos los siguiente:

alert(  ' Contrase\u00F1a err\u00F3nea\u0021 \n Int\u00E9ntalo de nuevo. ' );

Y obtendríamos:

Direcciones de interés:

Página de referencia para códigos Unicode

Tabla dinámica Unicode

Unicode Consorcium

Acerca de Carlos Benítez

Programador Web y arquitecto Javascript. Fundador de www.etnassoft.com y OpenLibra, la Biblioteca Libre Online
Esta entrada fue publicada en Javascript y etiquetada . Guarda el enlace permanente. Sígueme en Twitter

Últimos libros gratuitos añadidos a OpenLibra

{7} Comentarios.

  1. 03Feb2011/
    18:07 h /

    Muy útil, aún no sabía como poner acentos en js, pero aprenderse el código en Unicode es un poco engorroso 🙂

    • 03Feb2011/
      20:39 h /

      Jaja, es cierto Alejandro, pero pasa como casi con todo: cuando los has escrito 20 veces, terminas memorizándolos!

  2. 08Jun2011/
    23:46 h /

    Gracias por tu articulo.

    Saludos.

    Santiago de la Cruz.
    DF, Mexico

  3. 29Jul2011/
    23:27 h /

    esto funciona aunque la pagina este en un encodin distinto.. regularmente yo reparo igualando el encoding pero es una lata U.u

  4. 22Dic2011/
    12:38 h /

    Genialísimo… estuve peleando con esto toda la tarde de ayer para encontrar la solución. ¡Muchas gracias!

  5. 25Oct2012/
    1:54 h /

    Me pasa eso en correos electronicos que el receptor los recibe con codigos indescifrables!! Puede ser esto?

    • 25Oct2012/
      9:20 h /

      En los correos, por lo general, los caracteres se corrompen en la conversión ISO – UTF8 y se da en aquellos que no son estándar: acentos, ñ, etc…
      Ahí, necesitas que, con el lenguaje que utilices a la hora de crear el cuerpo del correo (Java, PHP o cualquier otro) escapes la cadena para convertirla a UTF8 directamente antes de enviarla.

      Por ejemplo, para PHP hay que corregir las cabeceras del mensaje para que entienda que se trata de un ‘charset’ en UTF-8. Hay un artículo que explica bien cómo hacerlo aquí: http://www.creativasfera.com/enviar-correo-via-php-con-codificacion-utf-8-de-acentos-y-n/

      Saludos!

      Saludos.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Licencia Creative Commons 3.0

®Copyright 2016. Cotenido web bajo licencia Creative Commons 3.0

Códigos bajo licencias MIT y GPL. Ver página de licencias para más información