Fundamentos de Programación

1

Programación Básica: Fundamentos y Creación de Proyectos en Línea

2

Programación Básica en Google Chrome: Variables y Funciones

3

Creación de una Página Web Básica con HTML

4

Estructura Básica de un Documento HTML

5

Estructura y funcionamiento básico de HTML y JavaScript

6

Instalación y uso básico de Visual Studio Code para programar

7

Declaración y Uso Básico de Variables en JavaScript

8

Programación de Piedra, Papel o Tijera en JavaScript

9

Programación de Piedra, Papel o Tijera en JavaScript

10

Generación de Números Aleatorios con JavaScript

11

Creación y uso de funciones en programación

12

Ciclos y Condiciones en Programación: Piedra, Papel o Tijera

13

Programación de un Juego de Piedra, Papel o Tijera en JavaScript

14

Manejo de Rutas y Archivos en Sistemas Operativos y Desarrollo Web

15

Manipulación del DOM y Eventos en JavaScript para Juegos Web

Quiz: Fundamentos de Programación

Desarrollando un juego con HTML y JavaScript

16

Maquetación de Páginas Web para Videojuegos en HTML

17

Selección de Mascotas en HTML para Juegos Interactivos

18

Programar eventos de clic en botones HTML con JavaScript

19

Eventos de Carga en JavaScript: Iniciar Juego y Seleccionar Mascota

20

Selección de Mascota en JavaScript: Implementación y Validación

21

Manipulación del DOM con JavaScript para mostrar mascota seleccionada

22

Selección Aleatoria de Mascota Enemiga en JavaScript

23

Eventos de clic y lógica de ataque en JavaScript

24

Ataques Aleatorios para Mascotas Enemigas en JavaScript

25

Creación de Mensajes Dinámicos en Combate HTML y JavaScript

26

Lógica de Combate en JavaScript para Juego Mokepon

27

Operadores Lógicos en Programación: AND, OR y NOT

28

Actualización de Vidas en Juego de Combate con JavaScript

29

Validación de Vidas y Mensajes Finales en Juegos

30

Funcionalidad de Reinicio y Desactivación de Botones en Juego

31

Mostrar y ocultar secciones en HTML con JavaScript

Quiz: Desarrollando un juego con HTML y JavaScript

Estilos con CSS

32

Estilos CSS: Selectores, Propiedades y Valores

33

Tipos de Visualización en CSS: Display Block, Inline e Inline Block

34

Alineación de Elementos con Flexbox en CSS

35

Modelo de Caja en CSS: Espaciado y Bordes

36

Diseño y Estilo de Páginas Web con HTML y CSS

37

Estilos CSS para Botones en Juegos: Diseño de Pantallas Interactivas

38

Estilos CSS para Mejorar la Interfaz de un Juego

39

Estilizado de Pantallas de Juego con CSS y Flexbox

40

Separación de mensajes y estilos en JavaScript y HTML

41

CSS Grid: Organiza Elementos en Rejillas Bidimensionales

42

Diseño Responsivo con CSS: Media Queries y Flexbox

43

Pseudoclases en CSS: Mejora la Interacción del Usuario

Quiz: Estilos con CSS

Optimización de código

44

Optimización de Código JavaScript con Clases y Objetos

45

Optimización de Código JavaScript: Variables y Funciones

46

Clases y Objetos: Fundamentos para Optimizar Juegos

47

Construcción de Clases y Objetos en JavaScript

48

Uso de Arreglos para Almacenar Objetos en JavaScript

49

Agregar ataques a objetos en JavaScript

50

Renderizado Dinámico de Objetos en HTML con JavaScript

51

Solución de errores en variables y elementos HTML en JavaScript

52

Uso de Objetos para Centralizar Información en JavaScript

53

Selección de Mascota Aleatoria en JavaScript

54

Iteración de Arreglos y Manipulación DOM en JavaScript

55

Crear Función "mostrarAtaques" en JavaScript para Juegos

56

Eventos de Clic en Botones con JavaScript

57

Secuencia de Ataques y Validación de Resultados en JavaScript

58

Implementación de lógica de combate en juegos JavaScript

59

Programación de Juegos: Lógica de Ataques y Victorias

60

Optimización y Corrección de Errores en Juegos Web con JavaScript

Quiz: Optimización de código

Mapa con canvas

61

Dibujo y manejo de gráficos en Canvas con JavaScript

62

Movimiento de Capipepo en Canvas con HTML y JavaScript

63

Movimiento Continuo de Personajes en Canvas con JavaScript

64

Eventos de Teclado para Controlar Personajes en Juegos

65

Pintar Fondos y Personajes en Canvas HTML

66

Métodos de Clases en JavaScript para Juegos Interactivos

67

Detección de Colisiones en Videojuegos con JavaScript

68

Programación de eventos y colisiones en un juego interactivo

69

Ajuste Responsivo de Mapas en Pantallas con JavaScript

70

Estilos Responsivos en HTML y CSS para Mapas Interactivos

Quiz: Mapa con canvas

Backend: videojuego multijugador

71

Desarrollo de Juegos Multijugador con Cliente-Servidor y API

72

Instalación de Node.js en Windows para desarrollo backend

73

Uso básico de la terminal de comandos y Node.js

74

Creación de un Servidor Básico con Express.js en Node.js

75

Conceptos Clave de URIs y Verbos HTTP en Node.js

76

Desarrollo de API con Node.js y Comunicación Frontend-Backend

77

Selección de Mokepon y Comunicación JSON en Express.js

78

Implementación de un Endpoint para Coordenadas de Jugadores en Node.js

79

Integración de Coordenadas de Jugadores en Mokepon Multijugador

80

Optimización de Coordenadas en Videojuegos con JavaScript

81

Batalla Final en Mokepon: Implementación de Colisiones y Back-End

82

Implementación de Ataques en Tiempo Real para Videojuego Mokepon

Quiz: Backend: videojuego multijugador

Próximos pasos

83

Corrección de errores en juego multijugador con Node.js

84

Desarrollo Colaborativo con Git y GitHub para Programadores

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Construcción de Clases y Objetos en JavaScript

47/84
Recursos

Conociendo los conceptos básicos de la programación orientada a objetos, es momento de implementarlo en el código fuente de Javascript. Veamos cómo puedes crear clases y objetos a partir de estas.

Sintaxis de las clases y objetos

La mayoría de los lenguajes de programación poseen una sintaxis muy similar e intuitiva cuando se trata de crear clases y objetos. Los conceptos que aprendas sobre POO en Javascript, el día de mañana, te servirán para trabajar con otros lenguajes de programación.

Clases en Javascript

Crear tu primera clase en Javascript para luego crear objetos es muy sencillo. Basta con utilizar la palabra reservada class, seguido del nombre de la clase, comenzando siempre con mayúscula para seguir las buenas prácticas.

class Mokepon { }

Dentro de la clase, implementamos una función especial llamada constructor() que nos permitirá, justamente, construir objetos a partir de esta clase. El constructor recibe como parámetro los atributos o la información que la clase necesita para crear el objeto.

class Mokepon {
    constructor(nombre, foto, vida) {
        this.nombre = nombre;
        this.foto = foto;
        this.vida = vida;
    }
}

El constructor recibe por parámetro la información que necesita, en el orden indicado, y guardamos la misma dentro de las propiedades que llevan el mismo nombre.

Observa otra palabra muy importante en la programación orientada a objetos: this. La misma hace referencia al objeto actual donde te encuentras. Siempre que quieras acceder a un atributo o método dentro de la clase, lo harás con this.

Objetos en Javascript

La acción de crear un objeto a partir de una clase, lo conocemos con el nombre técnico de “Instanciar”. Siempre que tengas que crear un objeto, te encuentras instanciando una clase y creando el mismo.

Para crear una instancia de tu clase en Javascript, tienes que utilizar la palabra reservada new seguido del nombre de la clase que quieres intanciar.

let hipodoge = new Mokepon('Hipodoge', './assets/hipodoge.jpg', 5);

Al usar la clase como una función y pasándole la información propia del objeto, internamente te encuentras llamando al constructor de la clase que devolverá como resultado el objeto y lo guardamos en la variable del tipo let para utilizar el objeto posteriormente.

De esta manera puedes tener N cantidad de instancias de una clase y crear un objeto nuevo por cada Mokepon en tu videojuego.

Si haces un log de esta variable en la consola del navegador, observarás como toda la información del objeto se encuentra agrupada.

console.log(hipodoge);
Visualización en consola de un objeto

Si no conocías aún la función console.log() te servirá muchísimo de ahora en adelante para visualizar los datos de tu aplicación y corroborar que sean correctos.

Conclusión

Hasta este punto, ya conoces los conceptos básicos tanto teóricos como prácticos sobre la programación orientada a objetos. Suficiente para optimizar el código de tu software y volver lo más profesional, escalable y comprensible.


Contribución creada por: Kevin Fiorentino (Platzi Contributor)

Aportes 60

Preguntas 25

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Yo por fin entendiendo cuando Juan David dijo que LUEGO crearíamos las demás mascotas del juego y que realmente nunca se le olvidaron los otros tres

Resumen:

Usamos la palabra reservada class para crear una clase (que debe iniciar con Mayuscula) y la palabra reservada constructor para definir los atributos que tendrán nuestros futuros objetos.

Con this.atributo + atributo vamos ligando cada uno de los atributos y finalmente podemos crear variables = new ‘Clase’ y los valores de sus atributos

Ejemplo

class Nerd {
    constructor(nombre, foto, vida) {
        this.nombre + nombre
        this.foto + foto
        this.vida + vida
    }
}

let rajesh = new Nerd('Rajesh', './assets/rajesh.png', 3)

Pro tip: Con el portapapeles de windows 11 se facilita la tarea de copiar y pegar del html al js sin tener que andar cambiando constantemente de archivo

Duda: Por qué los nuevos objetos se declararon con let y no con const cómo aprendimos en la clase anterior???

Para quienes les guste, en visual studio code hay un theme de platzi muy bueno )

Las clases inician con mayúsculas.

Si quieren sacar algo de las cosas copiadas sin tener que copiarlo nuevamente, pueden usar el atajo win + v (en Windows [además se debe activar en la configuración])

class = Es la palabra reservada para generar una clase.

class “Mokepon” – Mokepon es el nombre de la clase, la única regla es que todos los nombres de las clases tienen que iniciar en mayúsculas.

constructor = Es la palabra reservada para construir un objeto, aquí van integradas las propiedades que tienen los objetos, como nombre, imagen, etc.;

Class Mokepom {
Constructor (nombre, foto, vida)
}

this = es una palabra reservada para indicar “esto mismo – algo inherente”. Ejemplo:

this.nombre = nombre
this.foto = foto
this.vida = vida

Ya que tenemos lo anterior podemos iniciar a construir los objetos (en este caso, los mokepones), para esto tenemos que generar una variable con el nombre del mokepon, por ejemplo:
Let hipodoge = new Mokepon

new = es una palabra reservada que indica la creación de un nuevo objeto de una clase que ya existe o hemos creado, en nuestro caso sería la clase Mokepon

let hipodoge = new Mokepon (“Hipodoge”, “url-link-imagen.png”, 5)

Bueno he creado los objetos en automático, ahora, si escribo por el nombre, obtengo las propiedades de cada uno.

class Mokepon {
    constructor(nombre, foto, vida) {
        this.nombre = nombre
        this.foto = foto
        this.vida = vida
    }
}

let personajes = [
    {
        nombre:'hipodoge',
        url_img:'./assets/mokepons_mokepon_hipodoge_attack.png',
        vida: 5
    },
    {
        nombre:'capipepo',
        url_img:'./assets/mokepons_mokepon_capipepo_attack.png',
        vida: 5
    },
    {
        nombre:'ratigueya',
        url_img:'./assets/mokepons_mokepon_ratigueya_attack.png',
        vida: 5
    }
]

for (x=0; x<Object.keys(personajes).length; x++) {
    let obj = personajes[x].nombre;
    obj = new Mokepon(personajes[x].nombre, personajes[x].url_img, personajes[x].vida)
    console.log(obj.nombre)
}

console.log (hipodoge)

esta funcion sirve para visualizar los objetos de una variable, en nuestra consola.

En este ejemplo, seria visualizar los objetos de hipodoge.

Me gusta la forma de enseñanza que tiene el profe Diego, ademas que es muy adecuado que nos deje abajo del video el recurso muy bien explicado y con ejemplos, ojala en todos los cursos realizaran un buen resumen como estos.

Qué genial! Excelente curso, ya veía hace un sobre " clases " y " objetos " y ya lo entiendo mucho mejor


Una de las formas de agregarle la imagen es inyectarlo en html desde el mismo js de la misma integración del nombre aleatorio, dejo la función de la selección del enemigo aleatorio con su imagen

Este es sin agregar la imagen

 function seleccionarEnemigo(){
    let pc=aleatorio(0,dayamones.length -1)

    mascotaEnemiga.innerHTML=dayamones[pc].nombre 
    }

Esta función ya contiene lo añadido de la parte de seleccionar imagen

function seleccionarEnemigo(){
    let pc=aleatorio(0,dayamones.length -1)

    mascotaEnemiga.innerHTML=dayamones[pc].nombre +  `<img src=${dayamones[pc].foto} alt=${dayamones[pc].nombre} >`
    }

el truco es agregar “+” y lo que inyectaras en el html en este caso la imagen desde la misma variable

con esto va a ser mas facil programar!!

Estoy muy emocionado para seguir avanzando en este curso, ya van 47 clases y ha sido una experiencia muy gratificante ya que siempre hay un sentido detrás de cada explicación además de que la comunidad y los comentarios de cada usuario complementan la experiencia haciendo que aprender se convierta en un ocio. 💚💚💚
clase sobre clases, valga la redundancia
¿ por qué me sale este mensaje en VSC al momento de colocar class Signature declarations can only be used in TypeScript files.ts(8017)? Gracias

Pasar primero por el curso de POO es una buena idea para entender muy bien todo esto

**🎬 Nuevo tutorial (capitulo 20) añadido al proyecto "Mokepon"** Estq vez implementaremos la clase "Mokepon" y a partir de ella crearemos los objetos, es decir los propios mokepones <https://www.youtube.com/watch?v=jcH6dYKHhaE> 📌Aprende a utilizar la palabra reservada "class" 📌Aprende a utilizar la función constructora de cada clase 📌Crea una función para automatizar la creación de objetos 💻Canal: Coding with Raul (Youtube) ![](https://static.platzi.com/media/user_upload/upload-e0aaa140-b074-47d5-872e-8ce4e025b665.jpeg)
Nuevo tutorial (capitulo 20) añadido al proyecto "Mokepon" <https://www.youtube.com/watch?v=jcH6dYKHhaE> Esta vez implementaremos la clase "Mokepon" y a partir de ella crearemos los objetos, es decir los propios mokepones 📌Aprende a utilizar la palabra reservada "class" 📌Aprende a utilizar la función constructora de cada clase 📌Crea una función para automatizar la creación de objetos 💻Canal: Coding with Raul (Youtube) ![](https://static.platzi.com/media/user_upload/upload-2710c7d0-39c3-4dd0-baf4-a6439d95945f.jpeg)
Nuevo tutorial (capitulo 20) añadido al proyecto "Mokepon" <https://www.youtube.com/watch?v=jcH6dYKHhaE> Esta vez implementaremos la clase "Mokepon" y a partir de ella crearemos los objetos, es decir los propios mokepones Aprende a utilizar la palabra reservada "class" Aprende a utilizar la función constructora de cada clase Crea una función para automatizar la creación de objetos Canal: Coding with Raul (Youtube) ![](https://static.platzi.com/media/user_upload/upload-5e052b9c-ce83-4d45-9979-44bdbf6cb4e9.jpeg)
En la programación orientada a objetos en JavaScript, el uso de `this` es fundamental. Al escribir `this.nombre = nombre;`, estás asignando el valor del parámetro `nombre` a la propiedad `nombre` del objeto actual. Esto permite que cada instancia de la clase tenga su propio valor para `nombre`. Si solo usaras `nombre`, estarías refiriéndote al parámetro del constructor y no a la propiedad del objeto. El uso de `this` asegura que la propiedad de cada objeto se diferencie entre instancias, especialmente cuando el mismo nombre de variable se utiliza en el contexto de diferentes objetos. Esto es esencial para mantener la encapsulación y el estado de cada objeto.
🎇🎇🎉✨**¡NUEVO!**🎉🎉🎉 He terminado un nuevo Proyecto y todo lo he documentado en tutoriales de vídeoEl proyecto completo consta de 19 capítulosEl proyecto implicó el uso de CSS3, Bootstrap, Javascript, HTML , sweetalert entre otros temasSe desarrollaron temas como: 📌Estilos css 📌Creación de contenido HTML desde Javascript mediante el uso de arrays y objetos y sus métodos 📌Cambio de las alertas nativas de JS por el uso de la librería sweetalert 📌Traspaso de información de una pantalla a otra para dibujar la card elegida 📌Aplicación de estilos css desde Javascript con la propiedad Styles 📌Creación de un sencillo sistema de vidas 📌Posicionamiento de elementos 📌Creación de botones flotantes con position de css Date una vuelta por mi canal de Youtube, no te arrepentirás, como el comentario que me acaban de dejar en mi canal (ver foto) 🎞Canal Youtube: Coding with Raul <https://youtube.com/playlist?list=PLHCvYDlpQU8kkKzbRZQy_4u29STjK2fEl&si=-TlbSYubgDJRCPH3> Si tienes problemas de acceder al canal escribeme por inbox y te aclaro cualquier duda Si requieres una asesoría adicional para entender algún aspecto que no entiendes, doy asesorías personalizadas Buen día! ![](https://static.platzi.com/media/user_upload/canal-e62bd99b-ff0e-44c6-8cf6-38e2b7cbdacc.jpg) ![](https://static.platzi.com/media/user_upload/Lista-b5eb4b31-ebb2-4a47-89bb-ec26a59c1ad2.jpg) ![](https://static.platzi.com/media/user_upload/Comentario-8b915cfe-63a5-44dc-b15e-2151f133a8ed.jpg)
📌🎇🎇NUEVO!🎇🎇 He terminado un nuevo Proyecto y todo lo he documentado en tutoriales de vídeoEl proyecto completo consta de 19 capítulosEl proyecto implicó el uso de CSS3, Bootstrap, Javascript, HTML , sweetalert entre otros temasSe desarrollaron temas como: 📌Estilos css 📌Creación de contenido HTML desde Javascript mediante el uso de arrays y objetos y sus métodos 📌Cambio de las alertas nativas de JS por el uso de la librería sweetalert 📌Traspaso de información de una pantalla a otra para dibujar la card elegida 📌Aplicación de estilos css desde Javascript con la propiedad Styles 📌Creación de un sencillo sistema de vidas 📌Posicionamiento de elementos 📌Creación de botones flotantes con position de css Date una vuelta por mi canal de Youtube, no te arrepentirás, como el comentario que me acaban de dejar en mi canal (ver foto) 🎞Canal Youtube: Coding with Raul <https://youtube.com/playlist?list=PLHCvYDlpQU8kkKzbRZQy_4u29STjK2fEl&si=-TlbSYubgDJRCPH3> Si tienes problemas de acceder al canal escribeme por inbox y te aclaro cualquier duda Si requieres una asesoría adicional para entender algún aspecto que no entiendes, doy asesorías personalizadas Buen día! ![](https://static.platzi.com/media/user_upload/canal-0f94cc5e-aa75-4ef5-b824-f651c9088616.jpg) ![](https://static.platzi.com/media/user_upload/Lista-02940765-3749-471b-9785-b417b3e67910.jpg) ![](https://static.platzi.com/media/user_upload/Comentario-7f22242d-ea22-4d9e-930a-4127e9e0cd23.jpg)
NUEVO! He terminado un nuevo Proyecto y todo lo he documentado en tutoriales de vídeoEl proyecto completo consta de 19 capítulosEl proyecto implicó el uso de CSS3, Bootstrap, Javascript, HTML , sweetalert entre otros temasSe desarrollaron temas como: 📌Estilos css 📌Creación de contenido HTML desde Javascript mediante el uso de arrays y objetos y sus métodos 📌Cambio de las alertas nativas de JS por el uso de la librería sweetalert 📌Traspaso de información de una pantalla a otra para dibujar la card elegida 📌Aplicación de estilos css desde Javascript con la propiedad Styles 📌Creación de un sencillo sistema de vidas 📌Posicionamiento de elementos 📌Creación de botones flotantes con position de css Date una vuelta por mi canal de Youtube, no te arrepentirás, como el comentario que me acaban de dejar en mi canal (ver foto) 🎞Canal Youtube: Coding with Raul <https://youtube.com/playlist?list=PLHCvYDlpQU8kkKzbRZQy_4u29STjK2fEl&si=-TlbSYubgDJRCPH3> Si tienes problemas de acceder al canal escribeme por inbox y te aclaro cualquier duda Si requieres una asesoría adicional para entender algún aspecto que no entiendes, doy asesorías personalizadas Buen día! ![](https://static.platzi.com/media/user_upload/Lista-cd516788-f54a-4186-a54c-bc3999783258.jpg) ![](https://static.platzi.com/media/user_upload/Comentario-66b6c312-d209-4cfd-8f48-1675e6bd0aea.jpg)
Este es un comentario off tópic: Me di cuenta que con la versión de VS Code que ahora tiene Github Copilot gratis te sugiere completar el código cuando estas creando los objetos. Si tienes esta versión, sugiero no completar el código sugerido. Funciona. Pero leí por ahí que escribir la solución manualmente hace que retengas mejor si estas aprendiendo. Eventualmente, nos vamos volviendo más experimentados y podemos aceptar la sugerencia del copiloto. Saludos, compañeros! :3
La mayoría de los lenguajes de programación poseen una **sintaxis muy similar e intuitiva cuando se trata de crear clases y objetos**. Los conceptos que aprendas sobre POO en Javascript, el día de mañana, te servirán para trabajar con otros lenguajes de programación.
Me encanta que Diego utilice el Word Wrap 🌻. Me gusta tenerlo así para mí mientras escribo, pero poder ver además toda la pantalla del profesor es genial
muy bueno
* uff
objetivo
mucha clase
Buenas, no se si me alguien me pueda decir porque no me sale el console.log en el navegador, estuve revisando el navegador y tengo activado lo de JavaScript, pero aun no me sale. ![](https://static.platzi.com/media/user_upload/image-d70a87a8-3dc2-44df-942d-b2a766a76969.jpg) ![](https://static.platzi.com/media/user_upload/image-bbd2542f-3abe-4eb1-899a-0db721024376.jpg)

se parece a la programación orientada a objetos jejejejee

Excelente clase

me gusta que este profesor no usa atajos para enseñar, lo cual, para los nuevos es bueno

Por fiiiin entendí qué rayos es el this y cómo funciona todo el asunto de las clases 😮

Cuando usamos this.nombre_variable, estamos declarando que queremos que se genere esa variable que va a contener el valor que le pasamos por parámetro en el constructor. A diferencia de otros lenguajes, que es necesario crear la variable primero y luego hacer referencia a ella con this o el nombre de la variable directamente. Esto si ya conoces otro lenguaje puede generar confusión.

para ver todos los objetos en console.log al mismo tiempo hay que envolverlos en llaves:
console.log({hipodoge, capipepo, ratigueya})

class --> clase
estructura de clase:
class nombre{
propiedades…
}

this.nombre --> apuntya a un objeto especifico

console.log() --> mensaje en consola

No había entendido la clase de objetos y clases, pero con esta clase del profe quedó muy clara

Tremenda clase, me toca volver a colocar a 0.85x y ahi vamos 😀

El profe es excelente, explica de 10!

Excelente explicación, aunque siento que me confunde un poco JS.

Gracias por esa explicación. Nunca había entendido bien lo de los objetos hasta que ví este video 💖

Bien explicado por parte del profesor 😃

Siempre me explicaban este tema…pero jamás pude entenderlo a la perfección. Con Ud es como aprender sumas y restas…lo hace ver muy fácil. Espero algún día estrechar su mano para agradecerle.

Los nombres de las clases inician con la letra mayúscula, a diferencia de las variables. Dentro de la clase va el constructor, donde se colocan las propiedades que van a tener los objetos. Ahí mismo se crean variables de clase con estructura this.nombre (ejemplo), que guardan valor de parámetros en el constructor.

💪 En esta clase se enseñó a como crear clases, utilizarlas y revisar que funcionen

Las clases son los planos básicos que necesitamos para construir los objetos, y estos objetos pueden incluir ciertos detalles que los hacen distintos entre ellos.
.
Con estos “planos” nos podemos guiar de forma más fácil y práctica para replicar los objetos.

excelente explicacion

interesante y util explicacion

Diego, no solo eres un excelente profesional sino también un excelente pedagogo… Te tomas el tiempo de aclarar cada tema y a ti te entiendo mucho mejor todo :3
Gracias profe!

Me parece increible la forma en que se usan las clases con los objetos para trabajar un videojuego. Sabia que se usa algo de programacion, pero jamas imagine que usa algunos metodos basicos.

clarificando los conceptos, gracias

la mejor explicación

6:57 Diego, pero podías simplemente copiar la estructura de la variable Hipodoge y ahí reemplazabas los parámetros de la clase con los nombres de las diferentes mascotas, porque solo era eso lo que había que cambiar, el resto de la estructura es idéntica por tratarse de los mismos objetos y me parece innecesariamente complicado la forma como lo hiciste, además de que también es más lento.

Cuando creamos una class, clase si o si deben comenzar con Mayuscula:
ejemplo:
class Mokepon
Las propiedades se crean con constructor ósea, ejemplo:

class Mokepon {
constructor (nombre, foto, vida) {
this.nombre = nombre
this.foto = foto
this.vida = vida
}
}

this y new son palabras reservadas.

No había escuchado de las clases, está genial este concepto y lo que nos permite realizar con el código.

Chicos espero estén bien. No he podido avanzar porque no me reconoce el constructor. Es decir la palabra constructor y this me salen como texto, no hacen nada en el código y por ende mi archivo queda hecho un caos. Espero puedan ayudarme.