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

Visual Studio Code

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

Ataques aleatorios del enemigo

24/84
Recursos

Aportes 34

Preguntas 9

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Reg铆strate o inicia sesi贸n para participar.

A este punto ya se va complicando un poco el tema con tanto codigo. Pero no me rendire ya quiero ver este videojuego terminado.

A mi se me ocurri贸 utilizar una variable global de tipo arreglo (ataquesDisponibles), en la cual almacen茅 los ataques disponibles, para que luego, dentro de la funci贸n ataqueAleatorioEnemigo(), se le asignara a otra variable global (ataqueEnemigo) el ataque del enemigo de manera aleatoria.

let ataquesDisponibles = ["FUEGO 馃敟", "AGUA 馃挧", "TIERRA 馃尡"]
let ataqueJugador
let ataqueEnemigo


function iniciarJuego() {
    //variables
    let botonMascotaJugador = document.getElementById("boton-mascota");

    //eventos
    botonMascotaJugador.addEventListener("click", seleccMascotaJugador);

    let botonFuego = document.getElementById("boton-fuego");
    botonFuego.addEventListener('click', ataqueFuego)
    let botonAgua = document.getElementById("boton-agua");
    botonAgua.addEventListener('click', ataqueAgua)
    let botonTierra = document.getElementById("boton-tierra");
    botonTierra.addEventListener('click', ataqueTierra)

}

//FUNCIONES PARA MASCOTAS

function seleccMascotaJugador() {
    let inputHipodoge = document.getElementById("hipodoge");
    let inputCapipepo = document.getElementById("capipepo");
    let inputRatigueya = document.getElementById("ratigueya");
    let mascotaSeleccJugador = document.getElementById("mascota-jugador");
    let mascotaActualJugador = "";

    if (inputHipodoge.checked) {
        mascotaActualJugador = "Hipodoge";
        alert("Has a seleccionado a " + mascotaActualJugador);
        mascotaSeleccJugador.innerHTML = mascotaActualJugador;
    } else if (inputCapipepo.checked) {
        mascotaActualJugador = "Capipepo";
        alert("Has a seleccionado a " + mascotaActualJugador);
        mascotaSeleccJugador.innerHTML = mascotaActualJugador;
    } else if (inputRatigueya.checked) {
        mascotaActualJugador = "Ratig眉eya";
        alert("Has a seleccionado a " + mascotaActualJugador);
        mascotaSeleccJugador.innerHTML = mascotaActualJugador;
    } else {
        alert("Selecciona tu mascota");
    }

    seleccMascotaenemigo()
}

function seleccMascotaenemigo() {
    let ataqueAleatorio = aleatorio(1, 3)
    let mascotaSeleccEnemigo = document.getElementById("mascota-enemigo");
    let mascotaActualEnemigo = "";

    if (ataqueAleatorio == 1) {
        //Hipodoge
        mascotaActualEnemigo = "Hipodoge"
        mascotaSeleccEnemigo.innerHTML = mascotaActualEnemigo;
    } else if (ataqueAleatorio == 2) {
        //Capipepo
        mascotaActualEnemigo = "Capipepo"
        mascotaSeleccEnemigo.innerHTML = mascotaActualEnemigo;
    } else {
        //Ratig眉eya
        mascotaActualEnemigo = "Ratig眉eya"
        mascotaSeleccEnemigo.innerHTML = mascotaActualEnemigo;
    }
}

function aleatorio(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
}

//FUNCIONES PARA ATAQUES

function ataqueFuego() {
    ataqueJugador = "FUEGO 馃敟"
    alert(ataqueJugador)
    let spanAtaqueJugador = document.getElementById("ataque-jugador")
    spanAtaqueJugador.innerHTML = ataqueJugador

    ataqueAleatorioEnemigo()
}

function ataqueAgua() {
    ataqueJugador = "AGUA 馃挧"
    alert(ataqueJugador)
    let spanAtaqueJugador = document.getElementById("ataque-jugador")
    spanAtaqueJugador.innerHTML = ataqueJugador

    ataqueAleatorioEnemigo()
}

function ataqueTierra() {
    ataqueJugador = "TIERRA 馃尡"
    alert(ataqueJugador)
    let spanAtaqueJugador = document.getElementById("ataque-jugador")
    spanAtaqueJugador.innerHTML = ataqueJugador

    ataqueAleatorioEnemigo()
}

function ataqueAleatorioEnemigo() {
    ataqueEnemigo = ataquesDisponibles[Math.floor(Math.random() * ataquesDisponibles.length)]
    let spanAtaqueEnemigo = document.getElementById("ataque-enemigo")
    spanAtaqueEnemigo.innerHTML = ataqueEnemigo
}

window.addEventListener("load", iniciarJuego); //otra manera de llamar al script despu茅s de que se cargue todo el HTML
//la funci贸n iniciarJuego se carga cuando ya todo el contenido est谩 cargado.

Me adelant茅 a realizar la l贸gica de la funci贸n del ataque enemigo y me siento re feliz de que s铆 me sali贸 parecida a la del profesor, muy muy parecida. Me siento incre铆ble de que cada vez voy mejorando 馃槃

Aqu铆 mi manera dejar saber al usuario el ataque del enemigo despu茅s de elegir su ataque.

Tambi茅n tenemos otra forma de escribir las funciones llamada 鈥Funci贸n Flecha鈥 que normalmente se utiliza con funciones cortas para que el c贸digo se vea mas compacto. Ambas formas funcionan pero 茅sta 煤ltima tiene algunas limitaciones. mas informaci贸n al respecto aqu铆: https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Functions/Arrow_functions

Tambi茅n para aquellos que tengan un nivel de ingl茅s intermedio es bueno para practicar que lo traduscan todo al ingl茅s (nombres de variable, funciones, etc). de esa manera se van acostumbrando para cuando les toque leer el codigo de alguien m谩s (lo que seg煤n me dijeron pasa seguido).
Les dejo como va mi c贸digo hasta ahora y cualquier correci贸n y cr铆tica constructiva sobre como mejorarlo es bienvenida.

hagan los personajes asi jajaajaja

Este es mi aporte, me funciona perfectamente 馃槃}

function ataqueFuego() {
    ataqueJugador = 'FUEGO'
    alert(ataqueJugador)
    ataqueEnemigo()
}
function ataqueAgua() {
    ataqueJugador = "AGUA"
    alert(ataqueJugador)
    ataqueEnemigo()
}
function ataqueTierra() {
   ataqueJugador = 'TIERRA' 
   alert(ataqueJugador)
   ataqueEnemigo()
}


function ataqueEnemigo(){
    let variableAtaqueEnemigo = aleatorio(1,3)

    if (variableAtaqueEnemigo == 1) {
        alert('El ataque de tu enemigo es de Fuego')
    }else if(variableAtaqueEnemigo == 2){
        alert('El ataque de tu enemigo es de Agua')
    }else {
        alert('El ataque de tu enemigo es de Tierra')
    }
    
}

![](

Yo lo hice de esta manera:

function ataqueEnemigo() {
    let ataqueAleatorio = aleatorio(1,3)
    let spanATAQUEENEMIGO = document.getElementById("ATAQUE-ENEMIGO")

    if (ataqueAleatorio == 1) {
        spanATAQUEENEMIGO.innerHTML = "FUEGO"
    } else if (ataqueAleatorio == 2) {
        spanATAQUEENEMIGO.innerHTML = "AGUA"
    } else if (ataqueAleatorio == 3) {
        spanATAQUEENEMIGO.innerHTML = "TIERRA"
    }
}
alguien que me de una ayuda trato de usar los botones de ataque como se hace en la clase pero la variable global se define solo por la ultima funci贸n la de tierra sin importar cual bot贸n oprima con el click no se porque pasa ni como solucionarlo

Un detalle con los botones de ataque es que deberian habilitarse solamente cuando escojamos nuestra mascota.
Esto es muy facil, en el html cuando creamos los botones, le agregamos la propiedad disabled, as铆 estar谩n deshabilitados en un inicio.

Ahora nos vamos al javascript, por el momento tenemos la logica de los botones en la funci贸n iniciar juego, estas lineas las podemos mover a una funci贸n nueva llamada habilitarBotonesAtaque(), dicha funci贸n la utilizariamos al final de la funci贸n seleccionarMascotaJugador().
En la funci贸n que creamos, vamos a ir por cada bot贸n habilitandolo con la propiedad .disabled (la misma que colocamos en el html). Le colocamos que su valor sea false, ya que en un primer momento su valor es true. Nos quedaria de la siguiente forma:

Todo el c贸digo con el nuevo orden que le dimos quedaria as铆:

Por si alguien se pierde, esta clase va despu茅s de la clase llamada 鈥淎taques en JavaScript鈥. Me salieron en orden invertido 馃槄

Estuve un rato tratando de ver como resolver el minireto hasta que recorde una frase de cursos anteriores de 鈥淣o reinventar la rueda鈥 y fui a ver el codigo que habiamos hecho con Freddy y ahi continue con esa logica que me parecia bastante acertada, por suerte, quedo funcional el codigo
Le agregue un par de cosas para que en los alert diga que pokemon ataca pj
Siendo sincero, me gusta mas como lo hizo el profe, es mas agradable a la vista, me falta calle

let ataqueJugador
let pc = 0
//
function iniciarJuego() {

    let botonMascotaJugador = document.getElementById('boton-mascota')
    botonMascotaJugador.addEventListener('click', seleccionarMascotaJugador)

    let botonFuego = document.getElementById("boton-fuego")
    botonFuego.addEventListener("click", ataqueFuego)
    let botonAgua = document.getElementById("boton-agua")
    botonAgua.addEventListener("click", ataqueAgua)
    let botonTierra = document.getElementById("boton-tierra")
    botonTierra.addEventListener("click", ataqueTierra)
}

function seleccionarMascotaJugador () {
    let inputHipodoge = document.getElementById("hipodoge")
    let inputCapipepo = document.getElementById("capipepo")
    let inputRatigueya = document.getElementById("ratigueya")
    let spanMascotaJugador = document.getElementById("mascota-jugador")

    if(inputHipodoge.checked) {
        spanMascotaJugador.innerHTML = "Hipodoge"
    } else if(inputCapipepo.checked) {
        spanMascotaJugador.innerHTML = "Capipepo"
    } else if(inputRatigueya.checked) {
        spanMascotaJugador.innerHTML = "Ratigueya"
    } else {
        alert("No has elegido todavia...")
    }
    
    seleccionarMascotaEnemigo()

}

function seleccionarMascotaEnemigo() {
    let mascotaAleatorio = aleatorio(1, 3)
    let spanMascotaEnemigo = document.getElementById("mascota-enemigo")

    if(mascotaAleatorio == 1) {
        spanMascotaEnemigo.innerHTML = "Hipodoge"
    } else if(mascotaAleatorio == 2) {
        spanMascotaEnemigo.innerHTML = "Capipepo"
    } else {
        spanMascotaEnemigo.innerHTML = "Ratigueya"
    }

}

function aleatorio(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min)
}

function ataqueAleatorioEnemigo(enemigo) {
    resultado = ""
  
    if(enemigo == 1) {
        resultado = "Fuego"
    } else if(enemigo == 2) {
        resultado = "Agua"
    } else {
        resultado = "Tierra"
    }
    return resultado

}

function ataqueFuego() {
    ataqueJugador = "Fuego"
    let pc = aleatorio(1, 3)
    alert(ataqueJugador)
    alert(document.getElementById("mascota-enemigo").innerHTML + " ataca con: " + ataqueAleatorioEnemigo(pc)) 

}

function ataqueAgua() {
    ataqueJugador = "Agua"
    let pc = aleatorio(1, 3)
    alert(ataqueJugador)
    alert(document.getElementById("mascota-enemigo").innerHTML + " ataca con: " + ataqueAleatorioEnemigo(pc)) 

}

function ataqueTierra() {
    ataqueJugador = "Tierra"
    let pc = aleatorio(1, 3)
    alert(ataqueJugador)
    alert(document.getElementById("mascota-enemigo").innerHTML + " ataca con: " + ataqueAleatorioEnemigo(pc)) 
}

window.addEventListener("load", iniciarJuego)

En el minuto 3:25 cuando est茅n cambiando el nombre a una funci贸n o variable que invocaste varias veces no es necesario cambiar el nombre una por una, solo presiona F2 y te desplegar谩 un cuadro de texto para que se cambie el nombre a todas

:D justo mi soluci贸n fue igual a la tuya y la funci贸n con el mismo nombre jaja

En mi caso lo que hice fue que la funci贸n retornara el valor, as铆 me queda m谩s claro en el lugar que la utilizo que es lo que hace y como usar la variable. (Separar responsabilidades)
Bienvenidos comentarios:

let ataqueEnemigo;

function ataqueFuego() {
  ataqueJugador = "FUEGO";
  alert("Ataque jugador " + ataqueJugador);
  ataqueEnemigo = ataqueAleatorioEnemigo();
  alert("Ataque enemigo " + ataqueEnemigo);
}
function ataqueAgua() {
  ataqueJugador = "AGUA";
  alert("Ataque jugador " + ataqueJugador);
  ataqueEnemigo = ataqueAleatorioEnemigo();
  alert("Ataque enemigo " + ataqueEnemigo);
}
function ataqueTierra() {
  ataqueJugador = "TIERRA";
  alert("Ataque jugador " + ataqueJugador);
  ataqueEnemigo = ataqueAleatorioEnemigo();
  alert("Ataque enemigo " + ataqueEnemigo);
}

function ataqueAleatorioEnemigo() {
  const ataqueAleatorio = aleatorio(1, 3);
  if (ataqueAleatorio == 1) {
    return "FUEGO";
  } else if (ataqueAleatorio == 2) {
    return "AGUA";
  } else {
    return "TIERRA";
  }
}
<code> 
function ataqueFuego(){
    ataqueJugador= 'FUEGO'
    alert(ataqueJugador)
    ataqueEnemigo() 
}
function ataqueAgua(){
    ataqueJugador= 'AGUA'
    alert(ataqueJugador)
    ataqueEnemigo()
}
function ataqueTierra(){
    ataqueJugador= 'TIERRA'
    alert(ataqueJugador)
    ataqueEnemigo()
}
function ataqueEnemigo(){
    let aAleatorio= ataqueAleatorio(1,3)
   
    if ( aAleatorio == 1 ){
       alert('ENEMIGO ATACO CON FUEGO')
    } else if ( aAleatorio == 2 ){
        alert('ENEMIGO ATACO CON AGUA')
    } else {
        alert('ENEMIGO ATACO CON TIERRA')
    }

}
function ataqueAleatorio(min,max){
    return Math.floor(Math.random()*(max-min+1)+min)
}

Les comento que para evitar escribir las condiciones y los valores m谩ximo y m铆nimo, hice un diccionario, y los n煤meros de la funci贸n aleatoria van a variar seg煤n la carga de los datos.

function seleccionarMascotaEnemigo() {
    let data = base[0]
    let mascotaAleatorio = aleatorio(data)
    let spanMascotaEnemigo = document.getElementById('mascota-enemigo')
    spanMascotaEnemigo.innerHTML= data[mascotaAleatorio]
}

function ataqueFuego() {
    ataqueJugador = 'FUEGO'
    ataqueAleatorioEnemigo()
}

function ataqueAgua() {
    ataqueJugador = 'AGUA'
    ataqueAleatorioEnemigo()
}

function ataqueTierra() {
    ataqueJugador = 'TIERRA'
    ataqueAleatorioEnemigo()
}

function ataqueAleatorioEnemigo() {
    let data = base[1]
    let ataqueAleatorio = aleatorio(data)
    ataqueEnemigo = data[ataqueAleatorio].toUpperCase()
}

function aleatorio(data) {
    max= Object.keys(data).length
    min=1
    return Math.floor(Math.random()*(max-min+1)+min)
}

base = [
        {
            1:'Hipodoge',
            2:'Capipepo',
            3:'Ratigueya',
            4:'Langostelvis',
            5:'Tucapalma',
            6:'Pydos'
        },
        {
            1:'Fuego',
            2:'Agua',
            3:'Tierra'
        }
    ]

Esta es mi version simplificando los alerts y la seleccion de ataques:

let ataquejugador1
let ataquejugador2

// Funci贸n para activar los botones del DOM
window.addEventListener('load', function iniciarJuego() {
    //Activar boton de seleccion
    let botonSeleccionJugador1 = document.getElementById('boton-seleccion-jugador1')
    botonSeleccionJugador1.addEventListener('click', confirmarSeleccionJugadores)
    botonSeleccionJugador1.addEventListener('click', seleccionAtaqueJugador1)
})

// Funci贸n para generar numeros aleatorios entre un rango asignado
function generarEnterosAleatorios(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

// Funci贸n para interpretar seleccion del primer jugador
function seleccionJugador1() {
    let seleccionAjolote = document.getElementById('ajolote')
    let seleccionTopo = document.getElementById('topo')
    let seleccionHormigaDeFuego = document.getElementById('hormigadefuego')
    let seleccionKomodo = document.getElementById('komodo')
    let seleccionTortuga = document.getElementById('tortuga')
    let seleccionCaballoDeMar = document.getElementById('caballodemar')

    if(seleccionAjolote.checked) {
        return eleccion = 'al AJOLOTE' 
    } else if(seleccionTopo.checked) {
        return eleccion = 'al TOPO'
    } else if(seleccionHormigaDeFuego.checked) {
        return eleccion = 'a la HORMIGA DE FUEGO'
    } else if(seleccionKomodo.checked) {
        return eleccion = 'al DRAGON DE KOMODO'
    } else if(seleccionTortuga.checked) {
        return eleccion = 'a la TORTUGA'
    } else if(seleccionCaballoDeMar.checked) {
        return eleccion = 'al CABALLO DE MAR'
    } 
}

// Funci贸n para interpretar seleccion del segundo jugador
function seleccionJugador2(mokeponElegido) {
    if(mokeponElegido == 1) {  
        return eleccion = "al AJOLOTE"
    } else if(mokeponElegido == 2) {  
        return eleccion = "al TOPO"
    } else if(mokeponElegido == 3) {  
        return eleccion = "a la HORMIGA DE FUEGO"
    } else if(mokeponElegido == 4) {  
        return eleccion = "al DRAGON DE KOMODO"
    } else if(mokeponElegido == 5) {  
        return eleccion = "a la TORTUGA"
    } else if(mokeponElegido == 6) {  
        return eleccion = "al CABALLO DE MAR"
    }
}

// Funci贸n para confirmar la seleccion de ambos jugadores
function confirmarSeleccionJugadores() {

    // Imprimir seleccion del primer jugador
    let spanMokeponJugador1 = document.getElementById('mokepon-jugador1')
    alert('Has seleccionado ' +  seleccionJugador1())
    spanMokeponJugador1.innerHTML = seleccionJugador1()

    // La computadora elige un mokepon aleatoriamente (numeros entre 1 y 6)
    let eleccionJugador2 = generarEnterosAleatorios(1,6)
    
    // Imprimir seleccion del segundo jugador
    let spanMokeponJugador2 = document.getElementById('mokepon-jugador2')
    alert('La computadora ha seleccionado ' +  seleccionJugador2(eleccionJugador2))
    spanMokeponJugador2.innerHTML = seleccionJugador2(eleccionJugador2) 
}

// Funci贸n para elegir el ataque del primer jugador
function seleccionAtaqueJugador1() {
    let botonTierra = document.getElementById('boton-tierra')
    let botonFuego = document.getElementById('boton-fuego')
    let botonAgua = document.getElementById('boton-agua')
    let botonTierraFuego = document.getElementById('boton-tierraFuego')
    let botonTierraAgua = document.getElementById('boton-tierraAgua')
    let botonAguaFuego = document.getElementById('boton-aguaFuego')

    botonTierra.onclick = function ataqueTierra() {
        ataquejugador1 = 'TIERRA'
        confirmarAtaqueJugadores()
    }

    botonFuego.onclick = function ataquFuego() {
        ataquejugador1 = 'FUEGO'
        confirmarAtaqueJugadores()
    }
    
    botonAgua.onclick = function ataqueAgua() {
        ataquejugador1 = 'AGUA'
        confirmarAtaqueJugadores()
    }

    botonTierraFuego.onclick = function ataqueTierraFuego() {
        ataquejugador1 = 'TIERRA-FUEGO'
        confirmarAtaqueJugadores()
    }

    botonTierraAgua.onclick = function ataqueTierraAgua() {
        ataquejugador1 = 'TIERRA-AGUA'
        confirmarAtaqueJugadores()
    }

    botonAguaFuego.onclick = function ataqueAguaFuego() {
        ataquejugador1 = 'AGUA-FUEGO'
        confirmarAtaqueJugadores()
    }

}  

// Funci贸n para elegir el ataque del segundo jugador
function seleccionAtaqueJugador2(ataque) {
    if(ataque == 1) {  
        return eleccionAtaque = "TIERRA"
    } else if(ataque == 2) {  
        return eleccionAtaque = "FUEGO"
    } else if(ataque == 3) {  
        return eleccionAtaque = "AGUA"
    } else if(ataque == 4) {  
        return eleccionAtaque = "TIERRA-FUEGO"
    } else if(ataque == 5) {  
        return eleccionAtaque = "TIERRA-AGUA"
    } else if(ataque == 6) {  
        return eleccionAtaque = "AGUA-FUEGO"
    }
}

// Funci贸n para confirmar el ataque de ambos jugadores
function confirmarAtaqueJugadores() {

    // La computadora elige un ataque aleatoriamente (numeros entre 1 y 6)
    let eleccionAtaqueJugador2 = generarEnterosAleatorios(1,6)
    ataquejugador2 = seleccionAtaqueJugador2(eleccionAtaqueJugador2)

    alert("Tu mokepon ha hecho un ataque tipo " +  ataquejugador1
    +"\nEl enemigo ha hecho un ataque tipo " +  ataquejugador2)
}
function ataqueFuego() {
    ataqueJugador = 'FUEGO'
    alert(ataqueJugador)
    ataquePc()
}
function ataqueAgua() {
    ataqueJugador = 'AGUA'
    alert(ataqueJugador)
    ataquePc()
}
function ataqueTierra() {
    ataqueJugador = 'TIERRA'
    alert(ataqueJugador)
    ataquePc()
}
function ataquePc(){ 
    ataqueEnemigo = aleatorio(1,3)
    if (ataqueEnemigo== 1) {
        alert('Enemigo ataca con FUEGO')
    } else if (ataqueEnemigo == 2) {
        alert('Enemigo ataca con AGUA')
    } else if (ataqueEnemigo == 3){
        alert('Enemigo ataca con TIERRA')
    }
}

Parece que ya todos lo han notado pero esta clase se adelant贸 a la siguiente, deben ver primero la 24 y luego devolverse a esta, para seguir en el mismo orden en que se va programando el c贸digo.

Hola! A mi se me ocurrio utilizar una sola funcion para los ataques del jugador en vez de 3 (una por tipo de ataque).

//VARIABLES GLOBALES
let ataqueJugador
let ataqueEnemigo

//FUNCIONES

function iniciarJuego(){
    let botonMascotaJugador = document.getElementById("boton-mascota");
    botonMascotaJugador.addEventListener("click", seleccionarMascotaJugador);

    let botonFuego = document.getElementById("boton-fuego");
    botonFuego.addEventListener("click", function(){seleccionarAtaque("FUEGO")});
    let botonAgua = document.getElementById("boton-agua");
    botonAgua.addEventListener("click",  function(){seleccionarAtaque("AGUA")});
    let botonTierra = document.getElementById("boton-tierra");
    botonTierra.addEventListener("click",  function(){seleccionarAtaque("TIERRA")});
}

function aleatorio(min, max){
    return Math.floor(Math.random()*(max-min+1)+min);
}
//SELECCION DE MASCOTAS
function seleccionarMascotaJugador(){
    let inputHipodoge = document.getElementById("hipodoge");
    let inputCapipepo = document.getElementById("capipepo");
    let inputRatigueya = document.getElementById("ratigueya")
    let inputLangostelvis = document.getElementById("langostelvis");
    let inputTucapalma = document.getElementById("tucapalma");
    let inputPydos = document.getElementById("pydos");
    let spanMascotaJugador= document.getElementById("mascota-jugador");
    if(inputHipodoge.checked){
        spanMascotaJugador.innerHTML="Hipodoge";
    }else if(inputCapipepo.checked){
        spanMascotaJugador.innerHTML="Capipepo";
    }else if(inputRatigueya.checked){
        spanMascotaJugador.innerHTML="Ratigueya";
    }else if(inputLangostelvis.checked){
        spanMascotaJugador.innerHTML="Langostelvis";
    }else if(inputTucapalma.checked){
        spanMascotaJugador.innerHTML="Tucapalma";
    }else if(inputPydos.checked){
        spanMascotaJugador.innerHTML="Pydos";
    } else{
        alert("Debes seleccionar un MOKEPON!");
    }
    if(spanMascotaJugador.innerHTML!=""){
        seleccionarMascotaEnemigo();
    }
    
}

function seleccionarMascotaEnemigo(){
    let mascotaAleatoria = aleatorio (1,6);
    let spanMascotaEnemigo= document.getElementById("mascota-enemigo");
    if (mascotaAleatoria==1){
        spanMascotaEnemigo.innerHTML="Hipodoge";
    } else if (mascotaAleatoria==2){
        spanMascotaEnemigo.innerHTML="Capipepo";
    } else if (mascotaAleatoria==3){
        spanMascotaEnemigo.innerHTML="Ratigueya";
    } else if (mascotaAleatoria==4){
        spanMascotaEnemigo.innerHTML="Langostelvis";
    } else if (mascotaAleatoria==5){
        spanMascotaEnemigo.innerHTML="Tucapalma";
    } else {
        spanMascotaEnemigo.innerHTML="Pydos";
    }
}

//SELECCION DE ATAQUES

function seleccionarAtaqueEnemigo(){
    let ataqueAleatorio= aleatorio(1,3);
    if (ataqueAleatorio==1){
        ataqueEnemigo = "FUEGO";
    } else if (ataqueAleatorio==2){
        ataqueEnemigo = "AGUA";
    } else{
        ataqueEnemigo = "TIERRA";
    }   
}

function seleccionarAtaque(tipo){
    ataqueJugador = tipo;
    seleccionarAtaqueEnemigo();
}

window.addEventListener("load", iniciarJuego)

Lo logre!!

<let ataqueJugador 
let ataqueEnemigo


function iniciarJuego(){
    let botonMascotaJugador = document.getElementById('boton_mascota')
    botonMascotaJugador.addEventListener('click', seleccionarMascotaJugador)

    let botonFuego = document.getElementById('boton_fuego')
    botonFuego.addEventListener('click', ataqueFuego)
    let botonAgua = document.getElementById('boton_agua')
    botonAgua.addEventListener('click', ataqueAgua)
    let botonTierra = document.getElementById('boton_tierra')
    botonTierra.addEventListener('click', ataqueTierra)
}


function seleccionarMascotaJugador(){
    let inputHipodoge = document.getElementById('hipodoge').checked
    let inputCapipepo = document.getElementById('capipepo').checked
    let inputRatigueya = document.getElementById('ratigueya').checked
    let spanMascotaJugador = document.getElementById('mascotaJugador')

    if (inputHipodoge){
        //alert("seleccionaste a Hipodoge")
        spanMascotaJugador.innerHTML = "Hipodoge"
    }else if (inputCapipepo){
        //alert("seleccionaste a Capipepo")
        spanMascotaJugador.innerHTML = "Capipepo"
    }else if (inputRatigueya){
        //alert("seleccionaste a Ratigueya")
        spanMascotaJugador.innerHTML = "Ratigueya"
    }else{
        alert("Debes seleccionar una mascota")
        spanMascotaJugador.innerHTML = ""
    }

    seleccionarMascotaEnemigo()
    seleccionarAtaqueEnemigo()
}


function seleccionarMascotaEnemigo(){
    let spanMascotaEnemigo = document.getElementById('mascotaEnemigo')
    let mascotaEnemigo = aleatotio(1, 3)
    if(mascotaEnemigo == 1){
        spanMascotaEnemigo.innerHTML = "Hipodoge"
    }else if(mascotaEnemigo == 2){
        spanMascotaEnemigo.innerHTML = "Capipepo"
    }else if(mascotaEnemigo == 3){
        spanMascotaEnemigo.innerHTML = "Ratigueya"
    }
}


function seleccionarAtaqueEnemigo(){
    //let spanAtaqueEnemigo = document.getElementById('ataqueEnemigo')
    let ataqueEnemigo = aleatotio(1, 3)
    if(ataqueEnemigo == 1){
        ataqueEnemigo = 'FUEGO 馃敟'
        alert("Enemigo eligi贸: " + ataqueEnemigo)
    }else if(ataqueEnemigo == 2){
        ataqueEnemigo = 'AGUA 馃挧'
        alert("Enemigo eligi贸: " + ataqueEnemigo)
    }else if(ataqueEnemigo == 3){
        ataqueEnemigo = 'TIERRA 馃尡'
        alert("Enemigo eligi贸: " + ataqueEnemigo)
    }
}

function ataqueFuego(){
    ataqueJugador = 'FUEGO'
    alert(ataqueJugador)
}

function ataqueAgua(){
    ataqueJugador = 'AGUA'
    alert(ataqueJugador)
}

function ataqueTierra(){
    ataqueJugador = 'TIERRA'
    alert(ataqueJugador)
}

function aleatotio(min, max){
    return Math.floor(Math.random() * (max-min+1) + min)
}


window.addEventListener('load', iniciarJuego)> 

Es muy interesante adentrarse en este mundo 馃榿

My code (^///^)

let ataqueJugador
let ataqueEnemigo

function iniciarJuego(){
    let botonElegir = document.getElementById('boton-elegir')
    let botonFuego = document.getElementById('boton-fuego')
    let botonAgua = document.getElementById('boton-agua')
    let botonTierra = document.getElementById('boton-tierra')

    botonElegir.addEventListener('click', seleccionarMascotaJugador)
    botonFuego.addEventListener('click', ataqueFuego)
    botonAgua.addEventListener('click', ataqueAgua)
    botonTierra.addEventListener('click', ataqueTierra)
}

function seleccionarMascotaJugador() { 
    let inputHipodoge = document.getElementById('hipodoge')
    let inputCapipepo = document.getElementById('capipepo')
    let inputRatigueya = document.getElementById('ratigueya')
    let spanMascotaJugador = document.getElementById('mascota-jugador')
    
        
    if (inputHipodoge.checked) {
        // alert('Elegiste a Hipodoge! 馃挦')
        spanMascotaJugador.innerHTML = 'Hipodoge'
    } else if (inputCapipepo.checked) {
        // alert('Elegiste a Capipepo 馃尡')
        spanMascotaJugador.innerHTML = 'Capipepo'
    } else if (inputRatigueya.checked) {
        // alert('elegiste a Ratigueya 馃敟 ')
        spanMascotaJugador.innerHTML = 'Ratigueya'
    } else {
        alert('Por favor elige una mascota! 馃')
    }

    seleccionarMascotaEnemigo()
}

function seleccionarMascotaEnemigo(){
    let spanMascotaEnemigo = document.getElementById('mascota-enemigo')
    let mascotaAleatoriaEnemigo = numeroRandom(1,3)

    if (mascotaAleatoriaEnemigo == 1){
        spanMascotaEnemigo.innerHTML ='Hipodoge'
    } else if (mascotaAleatoriaEnemigo == 2){
        spanMascotaEnemigo.innerHTML ='Capipepo'
    } else {
        spanMascotaEnemigo.innerHTML = 'Ratigueya'
    }
}

function numeroRandom(min, max){
    return Math.floor(Math.random()*(max-min+1)+min)
}

function ataqueFuego(){
    ataqueJugador = 'Fuego 馃敟'
    alert('Atacas con ' + ataqueJugador)
    alert('Enemigo ataca con '+ seleccionarAtaqueEnemigo())
}

function ataqueAgua(){
    ataqueJugador = 'Agua 馃挦'
    alert('Atacas con ' + ataqueJugador)
    alert('Enemigo ataca con '+ seleccionarAtaqueEnemigo())
}

function ataqueTierra(){
    ataqueJugador = 'Tierra 馃尡'
    alert('Atacas con ' + ataqueJugador)
    alert('Enemigo ataca con '+ seleccionarAtaqueEnemigo())
}

function seleccionarAtaqueEnemigo(){
    ataqueEnemigo = numeroRandom(1,3)
    if (ataqueEnemigo == 1) {
        return 'Fuego 馃敟'
    } else if (ataqueEnemigo == 2){
        return 'Agua 馃挦'
    } else {
        return 'Tierra 馃尡'
    }
}

window.addEventListener('load', iniciarJuego)

Una forma de cambiar el nombre a una variable o funci贸n es que selecciones el nombre y con Ctrl + D se sombrear谩n el nombre repetidos en el c贸digo y puedes escribir y se ver谩 el cambio a todos esos nombres. esto sirve para que no cambies el nombre de la variable o funci贸n individualmente y te ahorras algo de tiempo.

Muy buena tu din谩mica de ense帽anza, es muy practica a la hora de transmitir los conocimientos鈥 Muy buenas las clases.馃憤

Asi quedo mi Codigo, Un poquito diferente al del profe con el (Switch)

var ataqueJugador
var ataqueEnemigo

function iniciarJuego() {
    let botonMascotaJugador = document.getElementById('boton-mokepon')
    botonMascotaJugador.addEventListener('click', seleccionarMokeponJugador)

    let botonFuego = document.getElementById('boton-fuego')
    botonFuego.addEventListener('click', ataqueFuego)
    let botonAgua = document.getElementById('boton-agua')
    botonAgua.addEventListener('click', ataqueAgua)
    let botonTierra = document.getElementById('boton-tierra')
    botonTierra.addEventListener('click', ataqueTierra)
}
    //Logica de seleccion de los mokepones del jugador
function seleccionarMokeponJugador() {
    let mokeponhipodoge = document.getElementById('Hipodoge')
    let mokeponcapipepo = document.getElementById('Capipepo')
    let mokeponratigueya = document.getElementById('Ratigueya')
    let spanMokeponJugador = document.getElementById('mokepon-jugador')
    
    if(mokeponhipodoge.checked == true)
    {
        spanMokeponJugador.innerHTML = 'Hipodoge'

    } else if(mokeponcapipepo.checked == true)
    {
        spanMokeponJugador.innerHTML = 'Capipepo'

    } else if(mokeponratigueya.checked == true)
    {
        spanMokeponJugador.innerHTML = 'Ratigueya'
    } else {
        alert('Por favor selecciona un mokepon')
    }

    seleccionarMokeponEnemigo()
}
    //logica de seleccion de los mokepones del enemigo
function seleccionarMokeponEnemigo() {
    let seleccionAleatorio = Randomnumbers(1,3)
    let spanMokeponEnemigo = document.getElementById('mokepon-enemigo')

    if  (seleccionAleatorio == 1) {
        spanMokeponEnemigo.innerHTML = 'Hipodoge'
    } else if (seleccionAleatorio == 2) {
        spanMokeponEnemigo.innerHTML = 'Capipepo'
    } else {
        spanMokeponEnemigo.innerHTML = 'Ratigueya'
    }
        
}  

function Randomnumbers(min, max) {
           return Math.floor( Math.random()* (max - min + 1) + min)
}
    //fuciones para los ataques de los mokepones
function ataqueFuego() {
    ataqueJugador = 'Fuego'
    ataqueEnemigoAleatorio()
}

function ataqueAgua() {
    ataqueJugador = 'Agua'
    ataqueEnemigoAleatorio()
}

function ataqueTierra() {
    ataqueJugador = 'Tierra'
    ataqueEnemigoAleatorio()
}

function ataqueEnemigoAleatorio() {
    let ataqueAleatorio = Randomnumbers(1,3)
    switch(ataqueAleatorio) {
        case 1:
            ataqueEnemigo = 'FUEGO'
            break;
        case 2:
            ataqueEnemigo = 'AGUA'
            break;
        case 3:
            ataqueEnemigo = 'TIERRA'
            break;
    }
}
 
window.addEventListener('load', iniciarJuego)

Guau鈥 super din谩micas y productivas las clases鈥 Tratando de seguir el ritmo a todos los conceptos y nombres y funciones, etc nuevos鈥 y como dijo Freddy en unos videos anteriores, volver a ver las clases la cantidad de veces que sea necesario! Gracias por tanto aporte y ense帽ar con tanto entusiasmo!

Otra opci贸n para ver si el c贸digo esta funcionando correctamente es usar console.log()

function ataqueEnemigop(){
let ataqueAleatorio = aleatorio (1, 3)
if(ataqueAleatorio == 1){
ataqueEnemigo = 鈥淔uego 馃敟鈥
}else if(ataqueAleatorio == 2){
ataqueEnemigo = 鈥淎gua 馃挧鈥
}else if(ataqueAleatorio == 3){
ataqueEnemigo = 鈥淭ierra 馃尡鈥
}
console.log(ataqueEnemigo)

function ataqueFuego(){
    ataqueJugador = 'Fuego'
    alert(ataqueJugador)
    seleccionAtaqueEnemigo()
}

function ataqueAgua(){
    ataqueJugador = 'Agua'
    alert(ataqueJugador)
    seleccionAtaqueEnemigo()
}

function ataqueTierra(){
    ataqueJugador = 'Tierra'
    alert(ataqueJugador)
    seleccionAtaqueEnemigo()
}

function seleccionAtaqueEnemigo(){
    let ataqueEnemigo = aleatorio(1,3)
    let spanAtaqueEnemigo= document.getElementById('ataqueEnemigo')
    if (ataqueEnemigo == 1){
        spanAtaqueEnemigo.innerHTML = 'Fuego'
    }
    else if(ataqueEnemigo == 2){
        spanAtaqueEnemigo.innerHTML = 'Agua'
    }
    else{
        spanAtaqueEnemigo.innerHTML = 'Tierra'
    }

El m铆o pasa por todos los ataques, sin tirar error en navegador, ya lo puse de cabeza y no encuentro el problema

Mi solucion quedo asi, ojala sea valida

function ataqueFire() {
  let spanAtaquePlayer = document.getElementById("ataque-player")
  spanAtaquePlayer.innerHTML = "Fuego"
  ataqueIA()
}

function ataqueWater() {
  let spanAtaquePlayer = document.getElementById("ataque-player")
  spanAtaquePlayer.innerHTML = "Agua"
  ataqueIA()
}

function ataqueEarth() {
  let spanAtaquePlayer = document.getElementById("ataque-player")
  spanAtaquePlayer.innerHTML = "Tierra"
  ataqueIA()
}

function ataqueIA() {
  let ataqueIA = aleatorio(1,3)
  let spanAtaqueIA = document.getElementById("ataque-ia")
  if (ataqueIA == 1) {
    spanAtaqueIA.innerHTML = "Fuego"
  } else if (ataqueIA == 2) {
    spanAtaqueIA.innerHTML = "Agua"
  } else if (ataqueIA == 3) {
    spanAtaqueIA.innerHTML = "Tierra"
  }
}

Creo que estan volteados los nombres de las clases jajaja (esta y la anterior)