Codificación aprenderaprogramar.com: CU01114E
CARACTERES Y CADENAS DE TEXTO EN JAVASCRIPT
A diferencia de otros lenguajes que diferencian un tipo de dato “carácter” (char) y otro cadena de texto (string), en JavaScript existe un único tipo para englobar tanto a caracteres como a cadenas de texto como a una cadena vacía: el tipo String.
VARIABLES STRING EN JAVASCRIPT
JavaScript permite definir el texto tanto dentro de comillas dobles como dentro de comillas simples. Por ejemplo es válido: var cadenaTexto; cadenaTexto = "aprenderaprogramar.com" ;
Y también es válido: cadenaTexto = 'aprenderaprogramar.com' ;
HTML también permite usar comillas simples o dobles indistintamente. Esto puede dar lugar a problemas. Por ejemplo:
onclick ="alert("Alerta JavaScript")" sería una construcción incorrecta porque el navegador no sabe interpretar qué comillas son de apertura y cuáles de cierre.
onclick ="alert('Alerta JavaScript')" sería una construcción correcta porque el navegador determina que las comillas dobles son las externas y las comillas simples las internas.
Nosotros preferiremos usar comillas dobles para HTML y comillas simples para JavaScript, aunque no hay nada que obligue a que esto tenga que ser así.
En JavaScript siempre que se quiera indicar la presencia de un texto se puede optar por comillas dobles o simples, según se prefiera. No obstante, habrá situaciones en las que queramos que existan comillas dentro del propio texto, y en este caso tenemos la opción a usar un tipo de comillas como delimitadoras externas y otro tipo como comillas internas del texto. Por ejemplo:
cadenaTexto = '"aprenderaprogramar.com"' ; supone que el texto está delimitado por comillas simples y que la cadena de texto contiene las comillas dobles.
cadenaTexto = " 'aprenderaprogramar.com' " ; supone que el texto está delimitado por comillas dobles y que la cadena de texto contiene las comillas simples.
Aún así, existirán casos en que queramos que un texto contenga simultáneamente comillas simples y dobles, con lo que la solución anterior no nos resulta satisfactoria. Para resolver estas situaciones, se usa el denominado carácter backslah o carácter de escape, que es el símbolo \.
El símbolo \ se usa para resolver la representación de símbolos que no pueden ser incluidos de forma normal dentro de un texto. Cabe destacar las siguientes secuencias de escape:
Secuencia de escape |
Resultado |
\' |
Comilla simple |
\" |
Comilla doble |
\\ |
Símbolo \ |
\n |
Nueva línea |
\t |
Tabulador |
Existen más caracteres de escape pero estos son los más usuales. También es posible introducir caracteres (de escape o no) usando la codificación Latin-1 o Unicode en que se basa JavaScript, por ejemplo \u0041 representa la letra A, \u00F3 representa la letra ó, \u005C representa el carácter \ y \xA9 representa el símbolo de copyright ©, pero esta codificación en general no la utilizaremos salvo en casos muy excepcionales. Si necesitas comprobar el código de los caracteres puedes hacerlo buscando en internet “List of Unicode characters”.
El símbolo \ incluido dentro de un texto será ignorado. Para introducir el símbolo \ siempre hemos de hacerlo escapándolo usando \\.
LONGITUD DE UNA CADENA DE CARACTERES
La longitud de una cadena de caracteres expresada como un valor numérico puede obtenerse escribiendo la cadena (o el nombre de la variable que la representa) seguido de .length.
Por ejemplo "extraordinario".length devuelve 14 por contener la palabra 14 letras y "pitón".length devuelve 5 por contener la palabra 5 letras.
textoUsuario.length devolverá el número de caracteres que contenga la variable textoUsuario.
"".length devuelve cero porque "" representa una cadena vacía o con cero caracteres.
En general cada carácter suma una unidad a la propiedad length del texto (aunque algunos caracteres extraños suman 2 unidades por representarse concatenando dos códigos Unicode, pero esto es algo a lo que no le prestaremos atención porque en la práctica casi nunca tendremos que trabajar con este tipo de caracteres extraños).
Veamos un ejemplo. Escribe este código y guárdalo en un archivo de extensión html (puedes cambiar la ruta de la imagen si quieres):
<html> <head> <title>Curso JavaScript aprenderaprogramar.com</title> <meta charset="utf-8"> <script type="text/javascript"> function mostrarMensaje1() { var textoUsuario; var cadenaTexto; cadenaTexto = '\xA9 aprenderaprogramar.com' ; alert ('cadena texto vale ' + cadenaTexto); cadenaTexto = '"aprenderaprogramar.com"' ; alert ('cadena texto es ' + cadenaTexto); cadenaTexto = "Letra A: \u0041, o con tilde: \u00F3 sigue Caracter \\ igualmente \u005C seguido de tres saltos de línea \n\n\n Prosigue comilla simple \' y doble \"\n\n\n" alert ('cadena texto ahora contiene ' + cadenaTexto); textoUsuario = prompt("Introduzca un texto por favor:"); alert ("El texto introducido fue " + textoUsuario + " con longitud de " + textoUsuario.length + " caracteres"); alert ("La longitud de extraordinario es de " + ("extraordinario".length) + " caracteres"); alert ("La longitud de la cadena vacía es de " + ("".length) + " caracteres"); } </script> </head> <body> <div> <p>Aquí un párrafo de texto situado antes de la imagen, dentro de un div contenedor</p> <img onclick="mostrarMensaje1()" src="http://i.imgur.com/afC0L.jpg" alt="Notepad++" title="Notepad++, un útil editor de texto"> <p onclick ="alert('Alerta JavaScript')" style="background-color:yellow;">Aquí otro párrafo de texto. JavaScript es un lenguaje utilizado para dotar de efectos dinámicos a las páginas web. </p> </div> </body> </html> |
Visualiza el resultado y comprueba que la página web se muestra con normalidad y que JavaScript se ejecuta con normalidad cuando pulsas sobre la imagen.
El resultado esperado es que se muestre lo siguiente (compruébalo):
cadena texto vale © aprenderaprogramar.comcadena texto es "aprenderaprogramar.com"
cadena texto ahora contiene Letra A: A, o con tilde: ó sigue Caracter \ igualmente \ seguido de tres saltos de línea
Prosigue comilla simple ' y doble "
Introduzca un texto por favor: andamio
El texto introducido fueandamio con longitud de 7 caracteres
La longitud de extraordinario es de 14 caracteres
La longitud de la cadena vacía es de 0 caracteres
EJERCICIO
Consulta en internet cuál es el código unicode que corresponde al carácter π (símbolo matemático Pi) y usando el código muestra por pantalla el mensaje “El número π vale 3.1416”.
Para comprobar si es correcta tu solución puedes consultar en los foros aprenderaprogramar.com.
Para acceder a la información general sobre este curso y al listado completo de entregas pulsa en este link: Ver curso completo.
Para hacer un comentario o consulta utiliza los foros aprenderaprogramar.com, abiertos a cualquier persona independientemente de su nivel de conocimiento.