JavaScript básico #2: variables

Importante: Pueden probar los scripts y crear los suyos mediante las herramientas para desarrolladores en su navegador favorito, si no saben cómo usarlas vean la introducción a JavaScript
Siguiendo con los tutoriales básicos sobre JavaScript, en este articulo hablaremos sobre algo importante, no sólo en este, sino en cualquier lenguaje de programación: las variables.

¿Qué son las variables JavaScript?

Las Variables JavaScript son contenedores, se utilizan para almacenar valores y datos.

Reglas básicas

1. Debe tener un identificador.
2. En la mayoría de los casos debe tener un valor.
3. Después del valor se debe agregar un punto y coma ;

Ejemplo de variables con numeros

var variable1 = 100;
var variable2 = 80;
//las sumamos
alert(variable1 + variable2);



Nota: así como se utilizó el signo de + para sumar, se utiliza el signo de – para restar, el signo de * para multiplicar y / para dividir.
En el ejemplo, los identificadores son variable1 y variable2, cuyo valor es un numero y después mostramos el resultado al sumarlos utilizando un mensaje emergente creado con JavaScript….con ello, ya empezamos a entender cómo funciona una variable.

Ejemplo de variables con texto

A diferencia de las variables con números, las variables con texto utilizan comillas para establecer un valor.
var nombre = "Desarrollo Geek";
alert(nombre + ' es un buen blog');



Como pueden ver en color verde, cuando se incluye texto y a la vez una variable, el texto requiere de comillas para ser interpretado como una cadena de texto…eso porque al no tener comillas automáticamente lo interpreta como variable. Además, se utilizan los signos de +, pero esta vez, no para sumar números, sino para unir valores.

Ahora, algo más complicado, usaremos más de una variable a la vez…..
var nombre = "Desarrollo Geek";
var tipo = "blog"
var fecha = "2015";
alert(nombre + ' es un ' + tipo + ' creado en ' + fecha);


Variables con valores obtenidos

Ahora pasaremos con las variables cuyo valor es obtenido a partir de JavaScript, ya sea algo simple o avanzado…..
var ancho = screen.width;
var alto = screen.height;
var pagina = location.href;
var titulo = document.title;
alert('Resolucion de pantalla: ' + ancho + 'x' + alto + '\nTitulo: ' + titulo + '\nEnlace: ' + pagina);


Variables locales y globales

Al igual que en otros lenguajes, en JavaScript también existen variables locales y globales….las variables locales son leídas únicamente por una determinada parte del código, mientras que las variables globales son leídas por todo el script.

Ejemplo de variable global:
//cremos la variable
var demo;
//creamos una funcion
function sumas(){ demo = 15; alert(demo + 10);}
//llamamos a la función
sumas();
//obtenemos el valor de demo
demo;


En este caso, declaramos la variable demo como global, de modo que el valor le será agregado más tarde, y de esa manera puede ser leída por todo el script.

Ejemplo de variable local
//creamos la funcion
function sumas2(){
//creamos la variable
var demo2 = 15;
alert(demo2 + 10);}
//llamamos a la funcion
sumas2();
//obtenemos el valor de demo2
demo2;


El resultado sería que al ejecutar la función, demo2 efectivamente existiría, pero al querer obtener el valor de demo2 sin llamar a la función nos mostrará un error «Uncaught ReferenceError: demo is not defined» ya que al ser local, sólo puede ser leída por la función.

Y con eso finaliza la segunda parte de los tutoriales básicos sobre JavaScipt, la recomendación de Desarrollo Geek es practicar cada uno de los ejemplos con valores e identificadores diferentes, pueden hacer sus pruebas a través del editor javascript en linea o utilizando la consola en las herramientas para desarrolladores de su navegador (click derecho>inspeccionar elemento)