3. 02.variables parte 1

 

Variables Parte 1

Hola.
Qué tal?

Vamos a ver un pequeño ejemplo con código de JavaScript y vamos a ir conociendo lo que son las variables en JavaScript.

Declaración de Variables

Bien, vamos a irnos a nuestro archivo juego.js y lo primero que haremos es declarar algunas variables. Utilizamos la palabra reservada var para declarar nuestras variables:

javascript
var vida, ataque, pocion;

Aquí hemos declarado tres variables:

  • vida: para representar la vida de un jugador.

  • ataque: para representar el daño que recibe el jugador.

  • pocion: para representar la cantidad de vida que se recupera al usar una poción.

También podemos declarar las variables de forma individual:

javascript
var vida;  
var ataque;  
var pocion;

Ambas formas son válidas, pero la primera es más simplificada.

Inicialización de Variables

Las variables han sido declaradas, pero aún no tienen un valor asignado. Vamos a inicializarlas:

javascript
vida = 100;      // El jugador comienza con 100 de vida.
ataque = 10;     // Cada ataque quita 10 de vida.
pocion = 20;     // La poción recupera 20 de vida.

Operaciones con Variables

Ahora, vamos a modificar el valor de la variable vida restando el ataque varias veces:

javascript
vida = vida - ataque;  // 100 - 10 = 90
vida = vida - ataque;  // 90 - 10 = 80
vida = vida - ataque;  // 80 - 10 = 70
vida = vida - ataque;  // 70 - 10 = 60
vida = vida - ataque;  // 60 - 10 = 50
vida = vida - ataque;  // 50 - 10 = 40

Si queremos ver el resultado, usamos console.log:

javascript
console.log(vida);  // Muestra 40 en la consola.

Luego, aumentamos la vida usando la poción:

javascript
vida = vida + pocion;  // 40 + 20 = 60
console.log(vida);     // Muestra 60 en la consola.

¿Por qué se llaman "variables"?

Se llaman variables porque su valor puede variar durante la ejecución del código. En este ejemplo, vida cambia de 100 a 40 y luego a 60.

Visualización en la Consola

Para ver los resultados, abrimos la consola del navegador (F12 > Consola) y ejecutamos el código. Cada vez que modificamos vida, el nuevo valor se refleja en la consola.

Este es un pequeño ejemplo del uso básico de variables en JavaScript. ¡En la próxima parte seguiremos explorando más conceptos!

Comentarios

Publicar un comentario

Entradas más populares de este blog

codigo

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > Protagonista y Disparos con Barra de Vida </ title > </ head > < body onload = " inicializa()" >     < canvas id = "canvas" width = "500" height = "300" style = " border:2px solid #000" ></ canvas > < script > let canvas, ctx; let FPS = 50 ; let vida = 100 ; // Imagen del protagonista let imgMega = new Image(); imgMega.src = 'img/mega.jpeg' ; // Inicialización function inicializa() {     canvas = document.getElementById( "canvas" );     ctx = canvas.getContext( "2d" );     setInterval(principal, 1000 / FPS); } // Clase Protagonista class Protagonista {     constructor (x, y) {         this .x = x;       ...
Leer más

5. 04.funciones parte1

  Post: Funciones en JavaScript - Parte 1 https://image.png Duración:  8:17 / 8:34 Introducción a las funciones en JavaScript Hola, ¿qué tal? Vamos a ver ahora el tema de las funciones en JavaScript, un concepto fundamental para desarrollar nuestros videojuegos. Variables iniciales javascript var vida = 100 ; var ataque = 10 ; var pocion = 20 ; Creando nuestra primera función La sintaxis básica de una función comienza con la palabra reservada  function , seguida del nombre de la función: javascript function muestraVida ( ) { console . log ( vida ) ; } Esta función tiene la tarea de mostrar nuestra vida actual en la consola. Para llamarla, simplemente usamos su nombre: javascript muestraVida ( ) ; Integrando funciones con HTML Podemos conectar esta función a un botón en HTML: html < button onClick = " muestraVida ( ) " > Mostrar Vida </ button > Cada vez que hagamos clic en este botón, se ejecutará la función y veremos nuestro nivel de vida (10...
Leer más