Ir al contenido principal

Pokemon en JavaScript usando Programación Orientada a Objetos - Prototipos


ABSTRACT — Este proyecto tiene como fin dar a conocer el gran potencial que tiene un lenguaje como Javascript usando POO – Prototipos, para el desarrollo de aplicaciones simples hasta muy completas. En este proyecto se desarrolló un pequeño juego, en consola, el cual emula un escenario de batalla entre dos entrenadores pokemones, usando la popularidad que obtuvo Pokemon en los últimos meses se decidió usar la trama de Pokemon para dar a conocer el gran potencial que tiene Javascript.

I. Introducción

JavaScript es un lenguaje basado en objetos que, en lugar de estar basado en clases, se basa en prototipos. Debido a esta diferencia, puede resultar menos evidente que JavaScript te permite crear jerarquías de objetos y herencia de propiedades y de sus valores.
Los lenguajes orientados a objetos basados en clases, como Java y C++, se basan en la existencia de dos entidades distintas: clases e instancias.
  • Una clase define todas las propiedades (considerando como propiedades los métodos y campos de Java, o los miembros de C++) que caracterizan un determinado conjunto de objetos. Una clase es una entidad abstracta, y no un ejemplar del conjunto de objetos que describe. Por ejemplo, la clase Pokemon puede representar el conjunto de todos los pokemones.
  • Una instancia, sin embargo, es la instanciación de una clase; es decir, uno de sus miembros. Por ejemplo, Pikachu podría ser una instancia de la clase Pokemon, representando a un individuo particular como un pokemon. Una instancia tiene exactamente las propiedades de su clase padre (ni más, ni menos).
Un lenguaje basado en prototipos, como JavaScript, no hace esta distinción: simplemente tiene objetos. Un lenguaje basado en prototipos tiene la noción del objeto prototípico, un objeto que se utiliza como una plantilla a partir de la cual se obtiene el conjunto inicial de propiedades de un objeto. Cualquier objeto puede especificar sus propias propiedades, ya sea cuando es creado inicialmente o en tiempo de ejecución. Además, cualquier objeto puede ser utilizado como el prototipo de otro objeto, permitiendo al segundo objeto compartir las propiedades del primero.

Figura 1: Definición de Pokemon en Java.

Figura 2: Definición de Pokemon en JavaScript.

Las definiciones Java y JavaScript de Pokemon que se muestran en la figura 1 y 2 son similares. Las únicas diferencias son que tienes que especificar el tipo de cada propiedad en Java, mientras que en JavaScript no, y que en Java tienes que crear un método constructor explícitamente en la clase.

II. Desarrollo

Para desarrollar nuestro pequeño juego de Pokemon hay que tener en cuenta los siguiente:
Un Pokemon es un bichito agresivo al que le gusta pelearse con otros Pokemones.
  • Todo Pokemon tiene una cierta energía vital, que se representa con un número natural.
  • Si en alguna circunstancia la energía de un Pokemon disminuye a un valor de 0 o menos, se considera que el Pokemon ha muerto. 
  • La energía inicial de un Pokemon es siempre un valor fijo.
  • Cada Pokemon tiene también una cierta fuerza, que se representa con un entero positivo.
  • Asimismo, cada Pokemon tiene un cierto valor de experiencia, que representa la cantidad de veces que mató a otro Pokemon.
  • El impacto de un Pokemon se calcula como el producto entre su fuerza y su experiencia.
  • Cuando un Pokemon golpea a otro Pokemon, la energía del segundo disminuye en una cantidad igual a la fuerza de impacto del primero.
  • Un entrenador Pokemon tiene uno o varios Pokemones.
  • Un entrenador puede retar a otro entrenador, ganará el entrenador que se quede sin Pokemones.

A. Diseño

Para poder llevar a cabo una batalla Pokemon, tendremos que crear dos prototipos: Pokemon y Entrenador.
Una Batalla Pokemon se lleva a cabo entre dos entrenadores, ambos con una cantidad de Pokemones distinta de 0, los Pokemones pelearan hasta debilitarse, la batalla terminará cuando un entrenador se halla quedado sin Pokemones vivos.

B. Programación

Teniendo en claro los requerimientos y reglas, los prototipos se muestran a continuación.

Figura 3: Prototipo Pokemon.


Figura 4:  Prototipo Entrenador.


A continuación, se muestra el diagrama de flujo de cómo se lleva a cabo una batalla Pokemon.

Figura 5: Diagrama de flujo de una batalla entre dos Pokemones.

Figura 6: Diagrama de flujo de una batalla Pokemon.

C. Pruebas

Para realizar una prueba de nuestro juego, crearemos 2 entrenadores (Ash y Gary), Ash tendrá un solo Pokemon, mientras que Gary tendrá a 2 Pokemones, Ash retará a una batalla Pokemon a Gary. Esta batalla esta arreglada.

Figura 7: Creación de objetos – Pokemones y Entrenadores.

Como podemos observar Ash solo tiene a pikachu, mientras que Gary tiene a squirtle y a pidge, ahora veamos el resultado de esta batalla.

Figura 8: Pelea entre Pikachu y Squirtle.

Figura 9: Pelea Entre Pidge y Pikachu.

Como era de esperarse la batalla Pokemon la gano Gary, Pikachu dio una gran batalla.

III. Conclusiones

Si bien, en este artículo apenas rasguñamos la superficie de la POO en JavaScript, ya tenemos una idea de lo que podemos hacer con un lenguaje de programación orientado a objetos basado en prototipos. JavaScript es asombroso por su flexibilidad, y que, al ser interpretado, rompe algunas barreras de los lenguajes estrictos y compilados, sin embargo, debemos estar atentos a evitar las malas prácticas, ya que muchas veces por desconocimiento del lenguaje, acabamos escribiendo código que va en contra de los paradigmas del lenguaje.

➜ Aquí pueden descargar el código fuente del proyecto en GitHub: JS-Pokemón

Comentarios

Entradas populares de este blog

Shell Scripting: script para crear un virtualhost en apache

Muchos de nosotros trabajamos con un servidor web local para nuestros proyectos, por lo general tenemos más de un proyecto en desarrollo, sea de trabajo o personal. En sistemas Unix la carpeta raíz del servidor se encentra en /var/www/ , al empezar en un nuevo proyecto creamos una nueva carpeta en la raíz del servidor /var/www/mi_blog/ accediendo a este desde la dirección http://localhost/mi_blog/ ,   trabajar de esta manera no es la más cómoda posible, configurando la directiva VirtualHost del servidor Apache podríamos usar http://mi_blog.com/ dando la sensación de trabajar con un dominio real.
Existen muchos tutoriales acerca de como configurar un VirtualHost en Apache, lo que yo vengo a mostrarles cómo crear un script que nos cree automáticamente un VirtualHost y la estructura de carpetas para todos los proyectos que nosotros deseemos, así ahorrándonos tiempo al tener que configurar manualmente cada VirtualHost para cada proyecto.
Script Bash para crear VirtualHost
Antes que nada e…