Observemos el siguiente ejemplo:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8">
<title>Página con JavaScript</title>
<script type="text/javascript">
var cadena = "Esto es una cadena";
var numero=75;
alert(cadena);
alert(numero);
</script>
</head>
<body>
</body>
</html>
Cuando lo ejecute, lo primero que verá será el cuadro de aviso con el valor asignado a la variable cadena. Lo verá sin comillas. Cuando le asignamos texto a una variable, en el código debemos escribir unas comillas que delimiten dicho texto, pero éstas no forman parte del mismo. El contenido del texto es lo que está escrito entre las comillas. Mucha gente espera que las comillas formen parte del texto, lo cual da origen a muchos errores
Como vemos, ambas variables pueden mostrarse en la página independientemente de su tipo. Por lo tanto, ya sabemos, que el tipo de una variable no influye para que pueda mostrar su valor al usuario aunque, si determina la forma de trabajar con ella, como veremos más adelante.
Como trabajar con variables de texto
A la hora de manejar variables de texto, podemos hacer muchísimas operaciones con ellas, y para eso analizaremos algunos ejemplos:
Concatenaciones
Se conoce como concatenación al proceso de unir dos o mas cadenas en una sola, mediante el uso del operador + (mas). Pero veamos un ejemplo de esto:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Página con JavaScript</title>
<script
type="text/javascript">
var cadena1="Esto es una cadena.";
cadena2
= "Y esto
es otra";
cadena3
= cadena1+cadena2;
alert
(cadena3);
</script>
</head>
<body>
</body>
</html>
Secuencias de escape
Anteriormente hemos visto que una cadena de texto se escribe en el código entre comillas, pero estas no se almacenan con la cadena. Pero puede ser que en algún momento deseemos que sí aparezcan. Para lograrlo consideremos el siguiente ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script
type="text/javascript">
var variable1="Este aviso dice: \"Hola\".";
alert
(variable1);
</script>
</head>
<body>
</body>
</html>
Como ven, para lograr que aparezcan las comillas dentro de la cadena de texto, necesitamos agregar es contraslash ( \), si no agregáramos este signo, al momento de poner comillas, JavaScript interpretaría que estamos cerrando o terminando la cadena de caracteres, sin embargo, con el símbolo, le decimos que omita el cierre de la cadena y continúe, se que es un poco difícil de entender, pero, conforme vayamos avanzando en la práctica, van a comprender todo lo que les comento, vamos a hacer una lista, con los caracteres de escape que existen, y haremos algún ejemplo.
Secuencias de escape
|
|
Secuencia
|
Efecto
|
\\
|
Inserta un contraslash
|
\”
|
Inserta comillas
dobles
|
\’
|
Inserta comillas
simples
|
\n
|
Inserta un salto de
línea
|
\f
|
Inserta un salto de
págna
|
\r
|
Inserta retorno de
carro
|
\t
|
Inserta una
tabulación
|
\b
|
Retrocede un carácter
|
Veamos un ejemplo con un salto de línea:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var variable1 =
"Esto es una línea\n Y esto es otra
línea";
alert
(variable1);
</script>
</head>
<body>
</body>
</html>
Ahora veamos un ejemplo con una tabulación:
<!DOCTYPE html>
<html lang="en">
<head>
<meta
charset="UTF-8">
<title>Document</title>
<script
type="text/javascript">
var
variable1 = "Esto
es un texto\t Y esto una tabulación";
alert (variable1);
</script>
</head>
<body>
</body>
</html>
Como trabajar con variables numéricas
Como les comentaba líneas arriba la razón de ser de las variables numéricas es realizar algún cálculo con ellas.
Las operaciones aritméticas básicas se realizan en JavaScript mediante los operadores básicos que conocemos desde la escuela (suma, resta, multiplicación y división) (+,-,*,/), además del módulo (%), que aunque tenga el símbolo del porcentaje, no es lo mismo y ya veremos ejemplos de eso.
Suma
La suma en JavaScript se lleva a cabo mediante el operador más (+) y para eso veremos un ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var primernumero=10,
segundonumero=20;
suma=primernumero+segundonumero;
alert
(suma);
</script>
</head>
<body>
</body>
</html>
Podemos combinar variables de texto, con variables numéricas. Consideremos el siguiente ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var primernumero=10, segundonumero=20;
suma=primernumero+segundonumero;
alert ("La suma de 10 y 20 es: "+suma);
</script>
</head>
<body>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var primernumero=10, segundonumero=20;
suma=primernumero+segundonumero;
alert ("La suma de 10 y 20 es: "+suma);
</script>
</head>
<body>
</body>
</html>
Como vemos es muy sencillo utilizar el operador (+), para realizar una suma. JavaScript nos proporciona otro operador para realizar la suma de una manera que podamos llamar "abreviada". Se trata del signo más igual (+=). Cuesta un poco familiarizarse con el, especialmente aquellos que no tienen experiencia previa, por eso empezaremos a hacerlo desde ahora.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var variable1=
10, variable2=20;
variable1+=variable2;
alert
("La suma de 10 y 20 es: "+variable1);
</script>
</head>
<body>
</body>
</html>
Como vemos, el operador (+=) nos sirve, para realizar una suma abreviada, pero sigamos adelante con más ejemplos, ahora de la resta
Resta
La resta se lleva a cabo, mediante el operador menos (-). Al igual que la suma, es muy sencilla de programar en JavaScript. Consideremos el siguiente ejemplo:
Como podemos ver la resta es muy similar a la suma, solo cambia el signo, también existe el signo -= (menos igual) que funciona exactamente igual a la suma.
Multiplicación
La multiplicación en JavaScript se lleva a efecto mediante el operador asterisco (*), es igual a las demás operaciones y también existe el *=.
División
La division en JavaScript (y en la mayoría de los lenguajes de programación) se realiza con la barra, llamada slash (/), también existe el signo /=.
JavaScript puede manejar números fraccionarios con la misma facilidad que los números enteros.
Veamos un ejemplo de las cuatro operaciones básicas
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
//Declaramos e inicializamos las variables de los
operandos
var sumando_1=6.3,
sumando_2=7.2, suma, linea_1;
var minuendo =
4.7, sustraendo=2.7,
resta, linea_2;
var multiplicando =
2.88, multiplicador=3.432,
producto, linea_3;
var dividiendo =
23.47, divisor=8.36,
cociente, linea_4;
//Calculamos los resultados
suma
= sumando_1 +
sumando_2;
resta= minuendo -
sustraendo;
producto
= multiplicando *
multiplicador;
cociente
= dividiendo /
divisor;
//Preparamos los resultados para su presentación
linea_1
= "La suma
de " + sumando_1 + " y "
+ sumando_2 +
"es: "+
suma;
linea_2
= "La resta
de " + minuendo + " y " +
sustraendo +
"es: "+
resta;
linea_3
= "El
producto de " + multiplicando+ " y "
+ multiplicador +
"es: "+
producto;
linea_4
= "El
cociente de " + dividiendo + " y "
+ divisor +
"es: "+
cociente;
//Mostramos los resultados
alert
(linea_1 + "\n"
+ linea_2 +
"\n" +
linea_3 + "\n"
+ linea_4);
</script>
</head>
<body>
</body>
</html>
En este ejemplo se hace uso de todas las operaciones básicas, espero les quede claro, quisiera hacer una mención de un caso en particular: la división entre cero. Muchos lenguajes de programación modernos generar un error cuando se trata de llevar acabo una operación de este tipo. Sin embargo, JavaScript lo trata de un modo especial y no genera error alguno. De hecho realiza lo que dicen las matemáticas al respecto: cualquier número dividido entre cero da como resultado infinito, y eso es lo que hace precisamente JavaScript. Consideremos el siguiente ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var dato =34/0;
alert
("El dato vale: " + dato);
</script>
</head>
<body>
</body>
</html>
Módulo
Tal como lo acabamos de ver, las divisiones no siempre dan un cociente exacto. En muchos casos es interesante poder obtener el residuo de una división. JavaScript nos proporciona para este fin, un operador llamado módulo (%), que se representa mediante el signo de tanto por ciento (%). Consideremos el siguiente ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var dividiendo =
10, divisor =
4, resto
resto
= dividiendo %
divisor;
alert
("El resto de dividir 10 entre 4 es: "
+ resto);
</script>
</head>
<body>
</body>
</html>
Incremento y decremento
En un programa informático es tan habitual incrementar o decrementar una variable numérica en una unidad que la mayor parte de los lenguajes de programación modernos emplean unos operadores específicos para estas funciones: son los operadores de increment (++) y de decremento (--). Consideremos el siguiente ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
variable1=10;
variable1++;
alert(variable1);
</script>
</head>
<body>
</body>
</html>
En el decremento sucede exactamente lo mismo, solo que resta en lugar de sumar.
En el decremento sucede exactamente lo mismo, solo que resta en lugar de sumar.
Hasta aquí el post sobre los tipos de variables, en nuestro siguiente post seguiremos trabajando con las variables, pero ahora veremos como saber el tipo de una variable y cambiar también su tipo, debo mencionar que existen otros tipos de variables que no vimos, pero veremos mas adelante, como son el valor bool y el valor DATE.
Espero que este post haya sido de su agrado y utilidad, saben que cualquier duda estoy a la orden, espero den clic en +1, compartan, comenten o den clic en algún anuncio.
No hay comentarios.:
Publicar un comentario