Fundamentos de Programaci贸n

1

Bienvenida a Platzi: 驴qu茅 necesitas para tomar el curso?

2

驴C贸mo aprender programaci贸n?

3

Crea tu primer sitio web

4

Sitios web con HTML

5

Estructura de 谩rbol en HTML

6

Instalando tu primer editor de c贸digo

7

C贸mo declarar variables y usar prompt

8

Algoritmo de piedra, papel o tijera

9

Algoritmo avanzado de piedra, papel o tijera

10

Aleatoriedad

11

Refactor del c贸digo usando funciones

12

Ciclos

13

Gana 3 veces

14

Archivos de HTML y JavaScript

15

驴Qu茅 es el DOM?

Quiz: Fundamentos de Programaci贸n

Desarrollando un juego con HTML y JavaScript

16

Maquetaci贸n con HTML

17

Secci贸n de elegir mascota

18

驴D贸nde ubicar la etiqueta script? Conectando HTML con JavaScript

19

Escuchando eventos con JavaScript

20

addEventListener

21

Manipulaci贸n del DOM

22

Enemigos aleatorios

23

Ataques en JavaScript

24

Ataques aleatorios del enemigo

25

Imprimiendo ataques del enemigo

26

驴Ganaste, perdiste o empataste?

27

Tablas de verdad

28

Creando el contador de vidas

29

驴Qui茅n gan贸 el juego?

30

Reiniciando el juego

31

Ocultando elementos HTML con JS para mejorar la UX del juego

Quiz: Desarrollando un juego con HTML y JavaScript

Estilos con CSS

32

Anatom铆a de CSS

33

Tipos de display

34

Flexbox

35

Modelo de caja

36

Im谩genes para los Mokepones

37

Estilos del bot贸n

38

Adaptando HTML al dise帽o del juego

39

Layout: t铆tulo y ataques

40

Adaptando JavaScript al dise帽o del juego

41

CSS Grid

42

Responsive Design

43

Detalles finales

Quiz: Estilos con CSS

Optimizaci贸n de c贸digo

44

Revisi贸n de c贸digo

45

Don't repeat yourself (DRY)

46

Clases y objetos

47

Clases y objetos de Mokepon

48

Arrays o arreglos

49

Objetos vs. arreglos

50

Ciclos: manipulando el DOM con iteradores

51

Declaraci贸n lenta de variables

52

Una sola fuente de la verdad

53

Mascotas aleatorias con arreglos

54

Ataques din谩micos por cada mascota: extraer

55

Renderizado din谩mico en HTML

56

Eventos de click din谩micos

57

Secuencia de ataques del enemigo

58

Iniciando el combate

59

Resolviendo el reto de condicionales

60

Optimizando el frontend del juego

Quiz: Optimizaci贸n de c贸digo

Mapa con canvas

61

Introducci贸n a canvas: dibujando con JavaScript

62

Moviendo a Capipepo hacia la derecha

63

Movimiento hacia todas las direcciones

64

Movimientos con el teclado

65

Im谩genes y personajes de fondo

66

M茅todos en las clases

67

Obst谩culos y colisiones

68

Combate entre mokepones colisionados

69

Mapa responsive

70

Botones bonitos y viewport

Quiz: Mapa con canvas

Backend: videojuego multijugador

71

驴Qu茅 es backend?

72

Instalaci贸n de Node.js y NPM

73

Terminal de comandos y Node.js

74

Servidor web con Express.js

75

HTTP, localhost, servidores y puertos

76

Express.js y fetch: API REST con JavaScript

77

JSON y POST: mokepon online

78

Transmisi贸n de coordenadas

79

Mokepones din谩micos en el mapa

80

Optimizando el mapa del juego

81

Batalla entre jugadores

82

Consumiendo la API de ataques del enemigo

Quiz: Backend: videojuego multijugador

Pr贸ximos pasos

83

Probando el juego en varios dispositivos

84

驴Y ahora qu茅 curso tomar?

No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Obst谩culos y colisiones

67/84
Recursos

Aportes 54

Preguntas 27

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

Con este curso he aprendido Matem谩ticas, L贸gica de razonamiento, Programaci贸n CSS JS, THML Y DE VIDEOJUEGOS 馃槑馃槑馃槑

Una maravilla de curso. Disfrut谩ndolo como un ni帽o peque帽o 馃檹馃徏鉂わ笍

Aqu铆 les dejo una idea o propuesta. Cuando haya una colisi贸n pueden probar a hacer sus propios alerts(), as铆 tendr谩n sus propios estilos y no los que muestra el navegador. Tambi茅n pueden a帽adirle todo los tipos de datos que venimos utilizando. Como el nombre del enemigo, incluso hacer un tipo de mensaje personalizado si el enemigo es uno u otro. Tambi茅n pueden a帽adirle un intervalo de tiempo para que el Modal desaparezca autom谩ticamente con el m茅todo setTimeOut().

Si la colisi贸n sucede mucho antes de lo planeado por las im谩genes que est谩n usando se puede ajustar de la siguiente manera

let arribaNerd = namePjPlayerObjeto.y +25
let abajoNerd = namePjPlayerObjeto.y + namePjPlayerObjeto.alto -25
let derechaNerd = namePjPlayerObjeto.x + namePjPlayerObjeto.ancho -25
let izquierdaNerd = namePjPlayerObjeto.x +25

Por cierto yo us茅 let y no const porque la posici贸n cambia conforme muevo el personaje, es decir no es constante seg煤n yo

En esta parte del curso habr铆a estado genial que nos ense帽aran a separar por modulos el codigo js, y exportarlo e importarlo porque ya es muy extenso, pero imagino que para fines did谩cticos esta bien. Sigo re emocionada aprendiendo :3

Desde que empec茅 a armar el juego a mi modo quise que muchas cosas fueran al AZAR (manteniendo el esp铆ritu de piedra, papel o tijera) as铆 que esta vez me pareci贸 un poco aburrido que lo personajes enemigos no se movieran鈥 les mostrare mi codigo que hace que se muevan:
-Uso mi funcion que me arma el array con los enemigos para darle un valor inicial de movimiento a los enemigos(valores diferentes para que no tomen en la misma direcci贸n)

function IndiceEnemigos (){
    enemigos = invocaciones.filter(function(pj){
        return pj.nombre != invocaciones[indiceInvocacion_p1].nombre
    })
    enemigos[0].velY = -2
    enemigos[0].velX = -3
    enemigos[1].velX = 2
    enemigos[1].velY = 3
}

-Necesito as铆 como para mover nuestro personaje(actualizar coordenadas en pantalla), una funci贸n que los mueva a ellos, esta funci贸n la activa otro intervalo

function movEnemigos (){
    enemigos[0].x += enemigos[0].velX
    enemigos[0].y += enemigos[0].velY

    enemigos[1].x += enemigos[1].velX
    enemigos[1].y += enemigos[1].velY

    controlMovEnem(0)
    controlMovEnem(1)  
}

-Luego necesito ponerles un l铆mite o se saldr谩n de la pantalla, para ello us贸 las coordenadas del borde de mi canva, al 鈥渃hocar鈥 contra el borde cambian de direcci贸n con una velocidad aleatoria y desv铆an ligeramente en el otro eje para que sea menos predecible el movimiento

function controlMovEnem (index){
    if(enemigos[index].x < 0 ){
        enemigos[index].velX = aleatorio(7,25)
        enemigos[index].velY += aleatorio(-5,5)
    }
    if (enemigos[index].x > 480) {
        enemigos[index].velX = aleatorio(-7,-25)
        enemigos[index].velY += aleatorio(-5,5)
    }
    if (enemigos[index].y < 0) {
        enemigos[index].velY = aleatorio(7,25)
        enemigos[index].velX += aleatorio(-5,5)
    }
    if (enemigos[index].y > 315) {
        enemigos[index].velY = aleatorio(-7,-25)
        enemigos[index].velX += aleatorio(-5,5)
    }
}

Con esto ya se mueven los enemigos, toca hacer unos ajustes adicionales para que se detengan luego de chocar pero no es nada que no se pueda hacer con lo que hemos visto鈥 de hecho todo lo que se me ocurre hacer lo hago con lo visto porque b谩sicamente no se mucho XD, cuando no se algo pero 鈥減ienso鈥 se que se puede hacer le pregunto a google :p para ver c贸mo se hace.

Aqu铆 hay un v铆deo donde te explican un poco a detalle sobre las colisiones por si alguien gusta darle una checada https://www.youtube.com/watch?v=fEuR4bEwNw0

馃槃 Tan feliz que siente uno cuando nota todo lo aprendido no? 馃槂 馃槂

Me parece que la Profesora explica demasiado r谩pido y lo hace ver demasiado simple y solo se limita a escribir en el c贸digo. Me parece que deber铆a pausar un poco, dando un poco m谩s de profundidad en la explicaci贸n de lo que se est谩 haciendo en el c贸digo.

no entiendo casi

Por si alguien quiere ver en el diagrama la function l贸gica.

x = horizontal (arriba, abajo)
y = vertical (izq, derecha)

Que buen curso!

Que manera de conectar y abordar cada tema.

rayos no entend铆 muy bien lo de os cuadro, 贸sea la explicaci贸n de la grilla

Como aprendimos en clases anteriores, si en un futuro queremos agregar m谩s mokepones enemigos, entonces ser铆a mejor optimizar la parte del c贸digo donde generamos los mokepones enemigos. Yo lo hice de esta manera:

  • Primero cre茅 un array donde guardaremos los objetos de los mokepones enemigos:
let enemyMokepons = []; // Save enemy's mokepons
  • Ahora le aplicamos un ForEach para recorrer el array y que con cada mokepon que est茅 ah铆 dentro haga algo:
enemyMokepons.forEach((enemyMokepon) => {
    enemyMokepon.paintMokepon(); // con solo esta l铆nea de c贸digo estamos pintando los mokepones enemigos que queramos
  });
  • De paso podemos tambi茅n comprobar si nuestro mokepon choca o colisiona con uno de esos mokepones enemigos, tal como lo vimos en esta clase. Quedar铆a de la siguiente manera:
enemyMokepons.forEach((enemyMokepon) => {
    enemyMokepon.paintMokepon();

    if (playerPetSelected.speedX || playerPetSelected.speedY) {
      checkCollision(enemyMokepon); // con solo esta l铆nea de c贸digo estamos comprobando si nuestro mokepon colisiona con cualquiera de los mokepones enemigos que tengamos
    }
  });
  • Y listo! ya nuestro c贸digo no solo quedar铆a optimizado si no abierto a que le agreguemos m谩s mokepones, solo tendr铆amos que crear nuevos objetos con sus propiedas y m茅todos y esta parte no tendr铆amos que tocarla.

Esto no es nuevo, ya lo hab铆amos hecho en anteriores clases. Espero les sirva para mejorar su c贸digo. Saludos!

No se si mi cerebro aguantara hasta el final del curso 馃槀馃槀

esta clase me costo mucho 馃榿 el tema de las funciones me viene pesando a lo largo del curso

Es mi impresi贸n o falt贸 una explicaci贸n m谩s detallada de la cuadricula? por ejemplo, c贸mo as铆 que la parte de ArribaCuadroPeque帽o es 2 si en la pantalla se ve como si estuviera en el punto (3,3)

Les recomiendo hacer notas en su c贸digo para que no olviden lo que est谩n aprendiendo, mucho 茅xito a todos los que est谩n llegando a estas zonas del curso de programaci贸n, vamos, 隆SI PUEDES!

Me sirvi贸 mucho para entender lo de las colisiones primero determinar que x es Horizontal y sobre el van los movimientos de arriba y abajo (la primera y segunda condici贸n) y el eje Y es vertical y en el van los movimientos de izquierda y derecha (la 3era y la 4ta condici贸n).

luego sobre la grilla inicial fui marcando mis resultados con azul los de x y con rojo los de y.

Yo en vez de crear cada una de las variables en la funci贸n, lo que hice fue crearlas en el constructor de las clase mokepon

class mokepon{ // we set a prototype (class in other languages) with class
	constructor(name, image, live, x = 10, y = 10){ 
		...
		
		this.x = x // x-axis
		this.y = y // y-axis
		this.w = 80 // width
		this.h = 80 // height
		...

		this.right = this.x + this.w
		this.left = this.x
		this.top = this.y
		this.bottom = this.y + this.h
	}

Despu茅s le a帽ad铆 un m茅todo para que cada vez que, si cambiaban los valores de x oy, se actualizaran los lados:

setSides(){
		this.right = this.x + this.w
		this.left = this.x
		this.top = this.y
		this.bottom = this.y + this.h
	}

Y al final as铆 qued贸 mi funci贸n:

function checkColision(enemy){
	playersMokeponObject.setSides()
	if(
		playersMokeponObject.top > enemy.bottom ||
		playersMokeponObject.bottom < enemy.top ||
		playersMokeponObject.left > enemy.right ||
		playersMokeponObject.right < enemy.left
	){
		return
	}
	console.log("Hay colisi贸n con " + enemy.name)
}

C贸digo completo

Estuve analizando la grilla y lo comprend铆 de esta manera:

  • Cuando dice 鈥渁bajo鈥 o 鈥渁rriba鈥 toma los valores de manera horizontal.
  • Cuando dice 鈥渋zquierda鈥 o 鈥渄erecha鈥 toma los valores de manera vertical
    De este modo es posible comparar las coordenadas entre cuadros para realizar las validaciones de mayor que o menor que. Obviamente, infiero que el cuadro morado es la cara del mokepon enemigo y la del naranja, la del mokepon del jugador. Les agradezco hacerme saber si estoy bien o mal.

Esto les ahorrar谩 unas cuantas l铆neas.



mokeponesEnemigos.forEach((mokeponEnemigo) => {
mokeponEnemigo.pintarMokepon()
if (mascotaJugadorObjeto.velocidadX !== 0 || mascotaJugadorObjeto.velocidadY !== 0) {
            revisarColision(mokeponEnemigo)
        }
})

La formula para saber si hay colisi贸n es si NO se cumplen estas reglas. Si solo alguna esta cumpli茅ndose, no hay colisi贸n.

myImagenAbajo < imagenEnemigoArriba
myImagenArriba > imagenEnemigoAbajo
myImagenDerecha < imagenEnemigoIzquierda
myImagenIzquierda > imagenEnemigoDerecha

Cu谩l era el comando para poder escribir en varios renglones a la misma vez???

Interesante lo de presionar Ctrl + click en la function o variable para ser redireccionado en donde se esta usando.

la Profe Estefany Salas explica de una muy buena manera鈥 馃槂

la explicacion de esta clase no fue la mejor , no entendi nada, como consejo a la profe estefany es que en un ffuturo de las lecciones un poco mas despacio y con su debida explicacion ya que da por hecho que todos entienden

Este segmento de verdad que no est谩 tan complicado que el segmento anterior. Est谩 mucho m谩s llevadero.

Despu茅s de ver la clase y leer el c贸digo, todavia no termino de comprender la l贸gica de la cuadr铆cula inicial, me est谩 costando un poco, aunque felizmente trabajando en el c贸digo, no tuve ning煤n problema al desarrollarlo

Confirmo, esta clase estuvo complicada, pero bueno 3 veces la v铆 hasta entenderla. GRacias. #Seguimos

Utilice un forEach para pintar a los personajes (mokepones), evitando pintar el que elegimos para que no se vea repetido y con el mismo forEach revisar si hay colisiones.

personajesEnemigo.forEach((personajeEnemigo) => {
        if (personajeJugadorObjeto.id === personajeEnemigo.id) {
            personajeJugadorObjeto.pintarPersonaje()
        } else {
            personajeEnemigo.pintarPersonaje()
            if ((personajeJugadorObjeto.velocidadX !== 0) || (personajeJugadorObjeto.velocidadY !== 0)) {
                revisarColision(personajeEnemigo)
            }
        }
    })

Uffaaa que clase! de mucha logica ! de seguro para verla unas 2 veces mas !!! de basico nada!! jaja 鈥 un abrazo compa帽eros y fuerza y aguante para los que aun seguimos aqui!!

Agradecido con Platzi por esta oportunidad de aprender.

Es interesante la forma en que se usan las colisiones, aunque este sea un tema de videojuegos. No esta nada mal ver algo de videjuegos usando programacion basica como HTML CSS JS.

Mi codigo

function revisioColosion(enemigo){
  const arribaEnemigo = enemigo.y
  const abajoEnemigo = enemigo.y + enemigo.alto
  const izquierdaEnemigo = enemigo.x
  const derechaEnemigo = enemigo.x + enemigo.ancho

  const arribaMascota = moke.y
  const abajoMascota =  moke.y + moke.alto
  const izquierdaMascota = moke.x
  const derechaMascota = moke.x + moke.ancho
  if(
    abajoMascota < arribaEnemigo ||
    arribaMascota > abajoEnemigo ||
    derechaMascota < izquierdaEnemigo ||
    izquierdaMascota > derechaEnemigo 
  ){
    return
  }
  mokeEnemigo =  enemigo
  seleccionarMascotaEnemigo()
  console.log ('mi perre'+ mokeEnemigo.nombre)
}

Bueno, menos mal sabe que la clase se va poniendo un poco complicada!!

Interesante clase, como todas!!!

con este curso una prende mejor

Super!

Que buena clase, disfrute mucho creando las coliciones.

esta profesora me encanta, es muy buena
驴Hay un curso para aprender a manejar la frustraci贸n? Es que a este punto voy a necesitarlo. 馃槀馃槀
necesito ayuda por favor, la imagen de mi ratigueya se queda en la parte superior pero las coordenadas de la colisi贸n o las coordenadas donde se supone que debe estar si est谩 no aparece en la posici贸n, alguien sabe que puede ser? ![](https://static.platzi.com/media/user_upload/image-1771c25d-3edc-4650-9338-d1ae4b15761a.jpg)
Buenas ya que he visto que se ha complicado un poco el entender la grilla y que muchos compa帽eros ya la han explicado, voy a dar la explicaci贸n de como yo la logre entender: 1.Arriba y abajo corresponden al eje x 2.Derecha e izquierda corresponden al eje y 3.Hay que tener en cuenta el enunciado para saber de donde buscar la posici贸n del objeto. ![]()![](https://static.platzi.com/media/user_upload/image-bfe3adac-fdad-4fb9-96d4-5d00ce261f52.jpg)
Buenas!, les comparto un problema que tuve. Apenas iniciaba el mapa me daba el "alert" de colisi贸n. Ten铆a el c贸digo id茅ntico al de la profe. Me sonaba raro que en la function revisarColision() utilizara en las variables la palabra "alto", "ancho". Lo cambi茅 al ingl茅s: const abajoEnemigo = enemigo.y + enemigo.height const derechaEnemigo = enemigo.x + enemigo.width Anduvo perfectamente. Saludos!

Quiero ayudarles a comprender la clase, sobre todo la l贸gica en guardar la posici贸n en x del borde de abajo de la imagen, y de guardar la posici贸n en y del borde de la derecha de la imagen.

Esta parte precisamente鈥

    const arribaEnemigo = enemigo.y
    const abajoEnemigo = enemigo.y + enemigo.alto
    const derechaEnemigo = enemigo.x + enemigo.ancho
    const izquierdaEnemigo = enemigo.x

Me costo mi tiempo comprender el porque al sumar la posici贸n del enemigo en 鈥測鈥 con el alto de la imagen da como resultado la posici贸n en 鈥測鈥 del borde de abajo de la imagen.

Todo radica en la funci贸n:

lienzo.drawImage(img, x, y, width, height); 

Antes cre铆a que en el punto exacto donde se cruza la posici贸n en 鈥渪鈥 con la posici贸n en 鈥測鈥 era donde se dibujaba la imagen, de manera que el punto de cruze es realmente el centro de la imagen dibujada. Pues no es as铆.
.
.
La posici贸n en 鈥渪鈥 realmente es donde inicia la parte superior de la imagen en la coordenada x, y la posici贸n en 鈥測鈥 es donde se inicia la parte del borde izquierdo de la imagen, por lo que en los parametros de width y height se nos pregunta hasta donde queremos que se extienda la imagen a partir del borde superior y el borde de la izquierda de la imagen.
.
.
Por eso mismo al sumar enemigo.y + enemigo.alto nos da la posici贸n en 鈥測鈥 del borde inferior de la imagen. De igual manera al sumar enemigo.x + enemigo.ancho nos da la posici贸n en 鈥渪鈥 del borde de la derecha de la imagen.
.
.
Espero haberles ayudado, si no me logr茅 explicar en alg煤n punto de mi aporte porfavor haganmelo saber.

Muestro mi manera que por ah铆 es m谩s eficiente en c贸digo.
(en mi m茅todo uno elige un mokepon de 6 y tiene que luchar con los otros 5)

primero, cuando toco el bot贸n de Elegir Mascota "guarde鈥 el 铆ndice del mokepon elegido = 鈥淢ascotaJugador鈥 y luego hay colisi贸n si se choca con alg煤n otro

En elegir mascota:

function seleccionarMascotaJugador() { // se ejecuta en -- iniciarJuego 
    let auxtemp = 0  // mantiene el orden de la funciones

    // obtiene nombre mascota
    if (inputHipodoge.checked) {
        mascotaJugador = inputHipodoge.id
        auxtemp = 1
    } else if (inputCapipepo.checked) {
        mascotaJugador = inputCapipepo.id
        auxtemp = 1
    } else if (inputRatigueya.checked) {
        mascotaJugador = inputRatigueya.id
        auxtemp = 1
    } else if (inputPydos.checked) {
        mascotaJugador = inputPydos.id
        auxtemp = 1
    } else if (inputTucapalma.checked) {
        mascotaJugador = inputTucapalma.id
        auxtemp = 1
    } else if (inputLangostelvis.checked) {
        mascotaJugador = inputLangostelvis.id
        auxtemp = 1
    } else {
        alert('Selecciona una mascota')
    }

    // esto solo se activa si el jugador eligio mascota
    if (auxtemp === 1) {

        // con el nombre obtengo el ID y lo guardo
        for (let i = 0; i < mokepones.length; i++) {
            if(mascotaJugador == mokepones[i].nombre){
                mascotaJugador = i
            }
        }

        // con el ID muestro los datos
        spanMascotaJugador.innerHTML = mokepones[mascotaJugador].nombre
        imgMascotaJugador.setAttribute('src', mokepones[mascotaJugador].foto)

        iniciarMapa();
    }

Ahora cuando dibujo los mokepones:

function pintarCanvas() {
    mokepones[mascotaJugador].x = mokepones[mascotaJugador].x + mokepones[mascotaJugador].velocidadX;
    mokepones[mascotaJugador].y = mokepones[mascotaJugador].y + mokepones[mascotaJugador].velocidadY;
    lienzo.clearRect(0, 0, mapa.width, mapa.height);
    lienzo.drawImage(
        mapaBackground,
        0, 0, mapa.width, mapa.height
    )

    for (let i = 0; i < mokepones.length; i++) {
        mokepones[i].pintarlo()
    }

    if (mokepones[mascotaJugador].velocidadX !== 0 ||
        mokepones[mascotaJugador].velocidadY !== 0 ) {
            for (let i = 0; i < mokepones.length; i++) {
                if (i !== mascotaJugador){
                    revisarColision(mokepones[i])
                }
            }
        }
}

genial,super excelente estoy como una esponja jajajaja aprendiendo鈥

const izquierdaEnemigo = enemigo.x
const derechaEnemigo = enemigo.x + enemigo.ancho

const arribaEnemigo = enemigo.y
const abajoEnemigo = enemigo.y + enemigo.alto
  1. Creamos una funcion llamada revisarColisiones() en donde comprobaremos los valores de posicion y verimos si estan colisionando con un return y un alert
  2. Creamos una constante llamada arribaEnemigo = enemigo.y
  3. abajoenemigo = enemigo.y + enemigo.alto
  4. y hacemo lo mismo con el resto de puntos tanto en el enemigo como en la mascota aliada
  5. y por ultimo hacemos la comparacion de ser mayor que con todas estas variables
  6. ponemos un if para que solo revise la colision si este se esta moviendo (鈥 ahora entiendo por que se pedia que se utilizara el sistemas de fisicas de unity鈥)
  7. Cuando detente la colicion del enemigo, simplemente detenen su movimiento

<aside>
馃挕 el pivot es donde empieza a dibujar, a diferencia de unity que el pivot esta en el centro, el pivot en un canvas esta en la esquina superior derecha

</aside>

Para que los enemigos se puedan mover apenas cargue la p谩gina de manera aleatoria hice esta funci贸n:

function movEnemigoAleatorio(enemigo) {
    if(enemigo.x <= mapa.width-60 && enemigo.y <= mapa.height-60){//compara si est谩n dentro del mapa
        if(aleatorio(1,2)==1){
            if(aleatorio(1,2)==1){
                enemigo.x = enemigo.x+5
                enemigo.y = enemigo.y+0
            }
            else{
                enemigo.x = enemigo.x-5
                enemigo.y = enemigo.y+0
            }
        }
        else{
            if(aleatorio(1,2)==1){
                enemigo.x = enemigo.x+0
                enemigo.y = enemigo.y+5
            }
            else{
                enemigo.x = enemigo.x+0
                enemigo.y = enemigo.y-5
            }
        }
    }
    else{
        if(aleatorio(1,2)==1){
            enemigo.x = enemigo.x-5
        }
        else{
            enemigo.y = enemigo.y-5
        }

    }
} 

Adem谩s si desean que haya colisi贸n sin necesidad de mover con las flechas cuando el enemigo se mueva solo鈥omentar el if que encierra a las colisiones de los enemigos.

Uff, estuvo intensa esta clase, es extra帽o que no me salieron errores, que alivio 馃ぉ

el alert entonces sirve para dar respuesta al programar

asu que chevere es esto 馃槈 馃槂 馃槂 馃槂