Categorías

Ejemplo de Uso De Variables En JavaScript

Inicio » JavaScript » Uso de variables en JavaScript

Las variables en JavaScript son contenedores de datos que nos permiten almacenar y manipular información en nuestro código. Las variables se declaran utilizando las palabras clave 'var', 'let' o 'const' y pueden almacenar diferentes tipos de datos, como números, cadenas de texto, booleanos, objetos, funciones y arrays. En este artículo te mostramos cómo usar los 3 tipos de variables y te damos ejemplos prácticos.

¿Para qué sirven las variables en JavaScript?

Las variables nos permiten trabajar con información de manera flexible y eficiente, ya que nos facilitan:

  • Almacenar y acceder a información dinámica.
  • Realizar operaciones matemáticas y lógicas.
  • Crear y manipular estructuras de datos, como objetos y arrays.
  • Controlar el flujo del programa mediante condicionales y bucles.
  • Definir y ejecutar funciones. 

¿Cómo definir variables en JavaScript?

Las variables en JavaScript se definen utilizando las palabras clave 'var', 'let' o 'const'. Explicación:

  • var: Se utiliza para declarar variables globales o locales en una función, sin importar el bloque de código. Se desaconseja su uso.
  • let: Se utiliza para declarar variables limitadas al bloque de código actual.
  • const: Se utiliza para declarar variables constantes, cuyo valor no puede ser modificado después de su asignación.

Ejemplo de declaración de variables

var nombre = "Juan";
let edad = 25;
const pi = 3.14159265359;

En el siguiente ejemplo, se utilizan los tres tipos de variables (var, let, y const) para diferentes propósitos:

<html>
<body>
<script>
// Variable global con 'var' (evitar su uso en la medida de lo posible)
var contadorGlobal = 0;
function ejemploVariables() {
// Variable 'const' para mantener un valor inmutable
const pi = 3.14159;
// Variable 'let' para mantener un valor mutable dentro de un bloque
let contadorLocal = 0;
for (let i = 0; i < 5; i++) {
// 'i' es una variable 'let' cuyo ámbito está limitado al bucle for
contadorLocal += i;
contadorGlobal += i;
}
console.log("Valor de PI: " + pi); // 3.14159
console.log("Contador local: " + contadorLocal); // 10
}
ejemploVariables();
console.log("Contador global: " + contadorGlobal); // 10
</script>
</body>
</html>

Usos y ejemplos explicados

Ejemplo 1: Calcular el área de un círculo

En este ejemplo, utilizaremos variables para almacenar el valor del radio y calcular el área de un círculo.

<html>
<head>
<script>
const pi = 3.14159265359;
let radio = 5;
let area = pi * Math.pow(radio, 2);
document.write("El área del círculo con radio " + radio + " es: " + area);
</script>
</head>
<body>
</body>
</html>

Ejemplo 2: Crear una lista de elementos con un array

En este ejemplo, utilizaremos variables para almacenar un array de elementos y mostrarlos en una lista HTML.

<html>
<head>
<script>
let frutas = ["Manzana", "Plátano", "Naranja", "Fresa"];
function mostrarFrutas() {
let lista = "<ul>";
for (let i = 0; i < frutas.length; i++) {
lista += "<li>" + frutas[i] + "</li>";
}
lista += "</ul>";
document.getElementById("listaFrutas").innerHTML = lista;
}
</script>
</head>
<body>
<div id="listaFrutas"></div>
<button onclick="mostrarFrutas()">Mostrar lista de frutas</button>
</body>
</html>

3: Contador de clics en un botón

En este ejemplo, utilizaremos una variable para contar cuántas veces se ha hecho clic en un botón y mostrar el resultado en el HTML.

<html>
<head>
<script>
let contador = 0;
function incrementarContador() {
contador++;
document.getElementById("clics").innerHTML = "Clics: " + contador;
}
</script>
</head>
<body>
<button onclick="incrementarContador()">Haz clic aquí</button>
<p id="clics">Clics: 0</p>
</body>
</html>

 ¿Qué tipo de variable debo usar?

La mejor forma de declarar variables en JavaScript depende de la situación y el alcance que requieras para la variable. En general, se recomienda utilizar let y const en lugar de var, ya que estas dos declaraciones ofrecen un mejor control del ámbito y previenen errores comunes.

  1. Usa const para declarar variables que no cambiarán su valor a lo largo del programa. Esto hace que tu código sea más seguro y fácil de leer, ya que se garantiza que el valor de la variable no cambiará.
  2. Usa let para declarar variables que cambiarán su valor y cuyo alcance debe estar limitado a un bloque específico, como un bucle o una función. Al utilizar let, se evitan problemas relacionados con el "hoisting" y el ámbito global que pueden surgir con var.

¿Cómo citar? & Del Moral, M. (s.f.). Ejemplo de Uso De Variables En JavaScript.Ejemplo de. Recuperado el 26 de Septiembre de 2023 de https://www.ejemplode.com/24-javascript/520-ejemplo_de_uso_de_variables_en_javascript.html

JavaScript
Escrito por:
Mauricio del Moral Durán
Mauricio del Moral, fundador y creador de Ejemplo de, es un experto en enseñanza y un apasionado del ámbito educativo desde el año 2007. Ha dedicado una considerable parte de su vida profesional al estudio y al desarrollo de contenidos educativos en formatos digitales de alta calidad. Poseedor de una Licenciatura en Ciencias de la Comunicación, Mauricio es egresado de la prestigiosa Universidad Intercontinental.
Última modificación: 2023-04-16

Artículos Relacionados

Últimos 10 comentarios

  1. hola de nuevo , aqui en este codigo




    'declaramos la variable
    var nombre;
    'asignamos el valor Morris a la variable
    nombre="Morris";
    'imprimimos la variable
    document.write(nombre);
    document.write("");
    'asignamos otro valor a la variable
    nombre="Luffy";
    'imprimimos la variable
    document.write(nombre);


    Cómo declarar una variable, cómo asignarle valor a una variable y como desplegar o escribir una variable con JavaScript.



    no imprime la variable nombre..
    gracias.. ni con explorer ni firefox..
    Por jose 2011-02-26 a las 16:52:15
  2. la variable x mas z ma y da una variable de positiva
    Por jair 2010-09-21 a las 2:32:58

Deja un comentario


Acepto la política de privacidad.