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

Ciclos

12/84
Recursos

Al igual que ir a la escuela, en programaci贸n hay operaciones que se repiten mientras se cumpla alguna condici贸n (por ejemplo: ir a la escuela solo de lunes a viernes). As铆 que qu茅date si quieres aprender c贸mo funcionan 馃槈

驴C贸mo funcionan los ciclos?

Hay varias formas de generar ciclos en programaci贸n. Pero todos siguen la misma l贸gica:

  1. Primero fijas las condiciones. Por ejemplo: 鈥淢ientras no sea s谩bado, domingo ni feriado鈥.

  2. Luego indicas lo que suceder谩 cuando las condiciones se cumplan (operaciones, funciones a ejecutar, entre otros). Por ejemplo: 鈥淰oy a la escuela鈥.

  3. Finalmente, indicas lo que suceder谩 cuando las condiciones dejen de cumplirse (operaciones, funciones a ejecutar, entre otros). Por ejemplo: 鈥淢e quedo en casa鈥.

Forma estandar de ejecutar ciclos

驴Por qu茅 usar ciclos?

En programaci贸n, en ocasiones te topar谩s con c贸digo que tienes que repetir varias veces para lograr el efecto deseado. Quiz谩s puedas usar funciones para resumirlos, pero ellas no resuelven el problema cuando te ves obligado a ejecutarla una y otra vez.

En estos casos, lo mejor es programar un ciclo. De este modo, el ciclo repetir谩 un fragmento de c贸digo tantas veces como sea necesario hasta que deje de cumplirse la condici贸n que indicaste.

馃挕 Ojo, es importante que en el c贸digo escribas un modo de que el ciclo termine. Generalmente se hace aplicando en cada repetici贸n una peque帽a modificaci贸n a la variable donde se observa la condici贸n.

Por ejemplo, en el ciclo de ir a la escuela que vimos arriba, cada vez que evaluamos la condici贸n va a pasar un d铆a. De ese modo, tarde o temprano llegar铆amos al fin de semana o a un d铆a feriado, y no ser铆a necesario ir a la escuela.

Tu computadora no se va a quemar si por error escribes un ciclo infinito. Pero tu programa fallar谩 cuando lo ejecute.


Ahora, usaremos esta informaci贸n para modificar el c贸digo del juego de piedra, papel o tijera que creamos previamente. Vamos a crear un ciclo que nos permita hacer tres partidas seguidas, que guarde el n煤mero de victorias, y al final nos diga quien obtuvo m谩s victorias.

Haz click aqu铆 cuando est茅s listo para hacer la modificaci贸n 馃槈

Contribuci贸n creada por: Jhonkar Sufia (Platzi Contributor).

Aportes 131

Preguntas 25

Ordenar por:

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

o inicia sesi贸n.

馃挭馃挌 Me siento muy afortunado por haber terminado el anterior curso de programaci贸n b谩sica! Animo para todos los nuevos que entran!! lo que m谩s importa es que nunca paren de aprender. 馃殌

Recuerden que en la programaci贸n la practica hace al maestro! ^-^ 馃挭

Una forma interesante de ver los ciclos es verlos como 鈥渁lgo que da vueltitas鈥 馃槃.
.

.
Ese 鈥渁lgo鈥 se va a mantener dando vueltitas siempre y cuando la condici贸n que nosotros establezcamos sea verdadera. En el momento en el que nuestra condici贸n llega a ser falsa ese 鈥渁lgo鈥 deja de dar vueltas y el ciclo se detiene.
.
驴Pero que es ese algo? Ese algo es el c贸digo que queremos que se repita tantas veces como nosotros queramos, por ejemplo:
.

mientras hay comida:
    come

En este caso, la condici贸n es "hay comida" y nuestro c贸digo ser铆a "come". Entonces, entramos a dar vueltitas:
.

驴Hay comida? S铆.
    Come.
驴Hay comida? S铆.
    Come.
驴Hay comida? S铆.
    Come.
驴Hay comida? No.

-- Termina el ciclo o dejamos de dar vueltitas --

.
En resumidas cuentas, un ciclo nos permite repetir el mismo c贸digo tantas veces como queramos, solo necesitamos definir una condici贸n para saber cu谩ndo se dejar谩 de ejecutar ese ciclo 馃槃.

Un ciclo es una secuencia de instrucciones de c贸digo que se ejecuta repetidas veces, hasta que la condici贸n asignada a dicho bucle deja de cumplirse. Los 3 bucles m谩s utilizados en programaci贸n son el bucle while, el bucle for y el bucle do-while. 馃憣

馃槀Ese Freddy tiene frases profundas como:

Voy a la escuela, Finjo que estoy poniendo atenci贸n

En las clases donde los profes no ten铆an vocaci贸n quiz谩, pero aqu铆 en platzi, estoy enganchado al curso!!

Cada que un ciclo se reinicia, es decir, cada vez que un ciclo se ejecuta al menos una vez y empieza de nuevo se dice que itero una vez y empieza de nuevo, la segunda vez ya es una segunda iteraci贸n y as铆 el ciclo va a iterar determinadas veces como tu le indiques o hasta que se cumpla la condici贸n.
.
Conclusion: Iterar significa repetir un proceso con la intenci贸n de llegar a una meta.

Para dar formato y que se vea todo alineado y bonito es f谩cil, seleccionamos y le damos formato a la secci贸n. Es 煤til para entender la secuencia del c贸digo aparte de que no lo hacemos de forma manual.

Los ciclos son instrucciones repetitivas que se cumplen mientras las condiciones establecidas sean verdaderas.
Todos los ciclos tienen que tener una condici贸n que los frene.

鈥淣adie es eterno鈥 en el mundo!!鈥

yo viendo la clase despu茅s de que muri贸 Dario Gomez 馃槮

馃槃 Por ac谩 les dejo un ejemplo de c贸mo ser铆a el algoritmo que comenta Freddy llevado a la pr谩ctica. Si tienen alguna duda y alguien gusta que lo explique, con mucho gusto lo hago.

Nunca paren de aprender. 馃挌

鈥渘adie es eterno en el mundo鈥

La forma de ense帽ar de nuestro profesor Freddy Vega, es incomparable, no me arrepiento de invertir cada sol en estos cursos, mi futuro poco a poco gana experiencia.

esa funcion de limpiar el plato no me gusta

excelente pens茅 que no pod铆a entender pero todo es de disciplina =) 馃挭

Tom茅 el curso anterior de programaci贸n b谩sica y se ve que mejor贸 bastante. Pese a mis a帽os de experiencia, lo que me ense帽an estos cursos es aprender a ense帽ar

Wow, es muy adictivo aprender esto, representa un reto muy complejo, al mismo tiempo no puedo dejar de ver el curso.

Minuto 1:56 Freddy haci茅ndole un homenaje a Dario Gomez, semanas antes de su muerte. Adem谩s de Teso es vidente

//Inicio con el 100% de energia
energia = 100

//Ciclo -> Mientras mi energia sea mayor que 20%, entonces correr茅
mientras(energia > 20){

	//Acciones que hago al correr
	moverpiernaDerecha();
	moverpiernaIzquierda();
	respirar();
	
	energia = energia - 10; // Cada vez que corro, mi energia va disminuyendo en un 10%
}

//El ciclo finaliza cuando mi energia, deja de ser mayor que 20%.

Minuto 1:54, Freddy dice 鈥淣ada es eterno en el mundo鈥 y record茅 que Dar铆o Gomez muri贸. 馃槮

Dario Gomez es tan grande que hasta Freddy en medio de un curso le hizo su respectivo homenaje postumo jaja

Los ciclos son de las cosas m谩s 煤tiles en programaci贸n, pero hay que saber manejarlas 馃槵

EN EXCEL

=SI(Y(A1=鈥淐OMIDA EN EL PLATO鈥;B1=鈥淭ENGO HAMBRE鈥);鈥淪EGUIR COMIENDO鈥;"DEJAR DE COMER ")
respuesta SEGUIR COMIENDO
si una de las dos condiciones anteriores A1 o B1 no se cumple la respuesta seria DEJAR DE COMER

piedra = 馃
papel = 馃Щ
tijera = 鉁傦笍
馃ぃ馃ぃ馃ぃ

Ciclos

Es mi primer curso en Platzi en programaci贸n, deseo aprender y estoy feliz porque siento que encontr茅 la mejor escuela. Gracias Platzi

驴Pero si el plato no es m铆o?
Me pegan con la cuchara鈥

Prestar atenci贸n = aburrido
Fingir prestar atenci贸n = ok

mi forma de solicito 3 juegos seguidos

<code> 
```  <script>
        // funcion para numero aleatorio
        function resultado (max,min){
           return Math.floor(Math.random()*(max - min + 1) + min);
        }
        function eleccion (jugada){
            let elj =""
           if(jugada == 1 ){
             lelj ="馃"
            } 
            else if( jugada == 2 ){
               elj ="馃搫"
            }
            else if ( jugada == 3) {
                elj=" 鉁傦笍"
            }
            else {
                elj="valor null"                
            } 
            return elj
        }
        //----------------------------------------------------------------------------------------------------------------
       let jugador = 0;
       let pc = resultado (3,1);
       let resul =4; 
        // ciclos
        while(jugador != resul ){
             // piedra 1 , papel 2 y tijera 3 
            jugador = prompt ("elije  1 馃, 2 馃搫 y 3 鉁傦笍 " );
            jugador++;
            alert ("tu elijes" + eleccion(jugador))
            alert ("pc elije"+ eleccion (pc))
            // combate
            if (jugador == pc){
            alert ("empate");
            } else if ( jugador == 1 && pc ==3 || jugador== 3 && pc==2 || jugador ==2 && pc== 1){
            alert("ganaste");
            
            } else{
                alert("perdiste");
            }

        }
         
la entrop铆a si es eterna

隆隆Pr谩cticar, pr谩cticar y pr谩cticar!!

Me encanta este curso!!! 馃榿 Los ejemplos que dan, la facilidad y el poco tiempo que se requiere.

[](

Es una ventaja poder crear ciclos o bucles para realizar cualquier tipo de tarea, pero adem谩s de eso nos sirve por si una tarea necesita ejecutarse m谩s de una vez

IMPORTANTE

Todos los ciclos deben tener un fin, deben ser FINITOS

Todo ciclo debe tener una condici贸n que lo frene, ning煤n ciclo es infinito

Este curso se grab贸 antes de la muerte de Dar铆o G贸mez, Freddy invoc贸 la funci贸n 鈥淣adie es eterno en el mundo鈥 y pum! El ciclo se detuvo.

Todos los ciclos deben tener una condici贸n que los frena, sino ser铆an ciclos infinitos y nunca parar铆a. Ning煤n ciclo es infinito.

Yo como con la mano 馃槃
min: 2:13

Que 茅pico suena la palabra 鈥淚terar鈥 馃槑 es como muy pro, gran explicaci贸n de los ciclos!

La estructuraci贸n de la programaci贸n es como tu organizaci贸n en tu vida real 鈥i tienes organizado todo encontraras las cosas mas r谩pido para ser cambiada mejorada o simplemente eliminadas y que no causes un desastre en tu vida

En mi opini贸n, un ejemplo de ciclo podr铆a ser el siguiente:

 while(platzi == "Existe"){
                alert("Nunca parar谩s de aprender")
            }

Esta clase me dio hambre!

condiciones y ciclos

la educaci贸n no tiene edad, solo nosotros los latinos pensamos as铆

solo son ciclos :V

No son infinitos, hay una condici贸n que frena el ciclo. loop

  • Ejemplo : Hacer ejercicio: cuando estas corriendo, te despiertas y dices quiero correr y tu ciclo es quiero correr poner pierna adelante, pierna atr谩s, pierna adelante, pierna atr谩s, respira, seguir corriendo mientras tenga energ铆a, y cuando se acaba la energ铆a termina. Hay una variable de la energ铆a disponible para correr y esta se va disminuyendo hasta que parar.
  • Ejemplo 2: Mientras haya comida en el plato y tenga hambre seguir茅 comiendo, pero si alguna de estas dos (porque hay un y que indica que una de las dos debe cumplirse) deja de ser verdad entonces paro de comer y limpio el plato.

muchas gracias llego de la escuela enciendo la computadora y me pongo a programar eso me encanta

Break como c贸digo o <Ctrl> + <Break> te pueden salvar鈥 y evitar un Memory Overflow鈥

Es tu paracaidas para cuando un ciclo no se detiene por alguna raz贸n鈥 Si, algo se te pudo pasar por alto.

Matematicas Discretas

Uyyy las clases me est谩n pareciendo super bn y son muy vacanas

馃幎 nada es eterno en el mundo 馃幎
Detalles 馃

Un ciclo es algo que se ejecuta de forma repetitiva mientras algo es verdad, todos los ciclos tienen un fin.

Interesante el uso de los ciclos en la programacion, escuche que hay algunos que permiten el desarrollo de los videojuegos al momento de pelear con los jefes. Es casi la misma logica cuando uno los quiere enfrentar. Interesante la verdad. A seguir

Excelente ejemplo de ciclos en un juego: Los Sims 4.

**He aqu铆 un peque帽o ciclo usando while;
La p谩gina no dejara de preguntar, 驴cu谩nto es 2+2?, hasta que no le ingresen una repuesta correcta. Ena este caso 4
**

<!DOCTYPE html>
<html lang=鈥渆s鈥>
<head>
<meta charset=鈥淯TF-8鈥>
<title>matem谩tica </title>
<script>
let repuesta;
while (repuesta != 4 ){
pregunta = prompt("驴Cu谩nto es (2 + 2)??");
repuesta = pregunta;
alert(" Respondiste: " + repuesta);
if (repuesta == 4){
alert("隆隆隆Felicidades eres un Genio!!!");
} else {
alert(" Respuesta incorrecta.\n Vuelve a intentarlo");
}
}
</script>
</head>

Javascript en este momento me deja en la luna y mas aya jajaja

鈥淣ada es eterno en el mundo鈥 Freddy Vega

buena perrito, todo bien explicado, si me ha servido mucho este curso

ESTOY MUY CONTENTO DE ENCONTRAR A PLATZI !!!
BRINDO POR ESO

Los ciclos, bucles o loop son utilizados para realizar tareas repetitiivas basados en una condici贸n, y terminan cuando la condici贸n asignada a dicho bucle deje de cumplirse.
while( condicion) {
sentencia
}
while (haya comida en el plato) {
comer
}
Los tres tipos m谩s comunes de bucles son:
鈥 for
鈥 while
鈥 do while

Los ciclos son aquellos que nos permiten llegar desde un punto A a un punto B a partir de una cantidad de repeticiones que cumplen una condici贸n y nos permiten tener flujos e trabajo m谩s efectivos. 鈥淎na Belisa Martinez鈥 Excelente clase del Curso de pensamiento l贸gico: Manejo de datos, estructuras y funciones!

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8"/>
   <title> Piedra,papel y tijeras </title>
   <script>
      // 1 es piera, 2 es papel y 3 es tijera
      function aleatorio(min,max){
         return Math.floor(Math.random()*(max-min+1)+1)
      }

      function eleccion(jugada){
         let resultado = ""
         switch(jugada){
         case 1:
            resultado = "piedra 馃"
            break
         case 2:
            resultado = "papel 馃棡锔"
            break
         case 3:
            resultado = "tijeras 鉁傦笍"
            break
         }
         return resultado
      }
      
      let jugador = 0
      let pc = aleatorio(1,3)
      jugador = Number(prompt("elige 1 para piedra, 2 para paple y 3 para tijera: "))
      //alert("elegiste : " + jugador)

      alert("pc elige: " + eleccion(pc))
      alert("t煤 eliges: " + eleccion(jugador))
      
      if(jugador == pc){
         alert("ES UN EMPATE")
      }
      else if(jugador == 1 && pc == 3){
         alert("GANASTE")
      }
      else if(jugador == 2 && pc == 1){
         alert("GANASTE")
      }
      else if(jugador == 3 && pc == 2){
         alert("GANASTE")
      }
      else{
         alert("PERDISTE")
      }
   </script>

</head>
<body>
   <h1> juguemos </h1>

</body>
</html>

Los ejemplos de Freddy son 煤nicos y la forma en la que explica los conceptos de la programaci贸n lo hacen f谩cil, simple y accesible a toda persona que guste de aprender.
Mis felicitaciones a todo el equipo Platzi.

![](https://static.platzi.com/media/user_upload/image-97937aa9-889c-468f-95a2-88e49bfb383b.jpg)
Tmre una letrita nomas me cag贸 todo, es cierto mucha frustraci贸n y ya lo estoy asimilando, vamos gogogogogogo
Nada es eterno en el mundo

sigo aprendiendo y prepar谩ndome para saber programar confiar en el progreso

Interesante, reafirmar los conceptos b谩sicos es importante, para repasar y entrar con todo. #nuncaParesDeAprender

A mi me da risa de freddy como aveces hace expresiones, como nada es eterno, en el mundooo jejejeje

Hola Freddy disculpa pero te equivocas cuando dices que nada es eterno porque hay un Dios en los cielos que es eterno y nunca va a dejar de existir un saludo que Dios te Bendiga eres un exelente profesor

鈥渘ada es eterno鈥 en el mundo鈥

Bueno, si me costo hacerlo solo, aqu铆 est谩 soluci贸n que he desarrollado para hacer un contador de victorias, he dividido todo por funciones, entonces tengo as铆:

  • Un diccionario donde guardo los valores indicados por cada numero para selecci贸n, en caso que se ingrese un numero o cosa no ejecuta el c贸digo.
  • la funci贸n aleatoria para la pc.
  • una funci贸n para mostrar la selecci贸n del usuario y pc.
  • una funci贸n para evaluar el resultado.
  • una funci贸n para reiniciar el juego si ni el usuario o la pc llegan a tres victorias, en esta funci贸n devuelvo los valores a nulo o vaci贸 para que el usuario y la pc puedan elegir otra cosa.
  • una funci贸n para contar las victorias, en esta simplemente uso if para analizar quien llega primero a las 3 victorias, sino que se reinicie el juego. Ahora que lo pienso, puedo usar un ciclo para evitar usar if y else.
  • por ultimo una funci贸n que se llama jugar, el cual le da el valor a la pc, toma el valor del usuario y llama a las funciones mostrar mensaje, el resultado del combate y el contador de victorias.

ya finaliza el c贸digo llamando la funci贸n jugar para que todo se ejecute, est谩 es la soluci贸n que le d铆, luego voy a probar el ciclo en contar las victorias.

<!DOCTYPE html>
<head>
    <head>
        <meta charset="utf-8">
        <title>TopClassicGames</title>
        <script>
            var piedraPapelTijera = {
                "1": "piedra馃",
                "2": "papel馃摪",
                "3": "tijera鉁"
            };
            
            function aleatorioPc(min, max){
                return Math.floor(Math.random()*(max - min + 1) +1)
            }

            var jugador = "";
            var pc = "";
            var victoriasJugador = 0;
            var victoriasPc = 0;

            function mostrarEleccion(){
                alert("has ecogido ==> " + piedraPapelTijera[jugador])
                alert("Pc ha elegido ==> " + piedraPapelTijera[pc])
            };

        function resultadoCombate(){
            if (jugador == pc){
                alert("Empate馃槕");
            } else if(jugador == 1 && pc == 3 || jugador == 2 && pc == 1 || jugador == 3 && pc ==2){
                alert("has ganado馃槃");
                victoriasJugador ++;
            } else{
                alert("Perdiste馃槍");
                victoriasPc ++;
            }
        }

        function reiniciarJuego(){
            jugador = "";
            pc = "";
            jugar();
        }
        
        function contadorVictorias(){
            if(victoriasJugador == 3){
                alert("Has ganado, obtenido 3 Victorias")
            } else if(victoriasPc == 3){
                alert("Has perdido, has obtenido 3 derrotas")
            } else {
                reiniciarJuego()
            }
        }

        function jugar(){
            pc = aleatorioPc(1,3);
            jugador;
            
            do {jugador = prompt("Escoge: 1 ==> Piedra馃, 2 ==> Papel馃摪, 3 ==> Tijera鉁");
            } while(!(jugador in piedraPapelTijera));

            mostrarEleccion();
            resultadoCombate();
            contadorVictorias();
            
        }

        jugar();


        </script>
    </head>
    <body>
        <h1>Piedra, papel o tijera</h1>
    </body>
</head>

As铆 se ve mi c贸digo, lo hice antes de ver la explicaci贸n de Freddy, hab铆a visto el curso anterior de programaci贸n as铆 que us茅 mis conocimientos sobre el loop for. La 煤ltima condici贸n parece algo extra帽a
驴Por qu茅 si partida es == a rondas (3) - 1?
Sencillamente porque como partida inicia en 鈥0鈥 y el loop se ejecuta una 煤ltima vez cuando partida es 鈥2鈥 necesito hacer esa peque帽a operaci贸n aritm茅tica鈥
Pero quiz谩s alguien me dir谩, oye, podr铆as ahorrarte ese mambo mental si solo pusieras el loop como:

for(let partida = 1; partida <= rondas; partida++)
{
etc茅tera.
} 

Y yo te dir茅鈥ue tienes raz贸n, me di cuenta ahora xd

Discrepo con lo de cortar los ciclos como pr谩ctica generalizada. Si el lenguaje de programaci贸n permite ejecuciones paralelas, es posible y muy 煤til tener ciclos infinitos. En Scratch por ejemplo se usa mucho. No siempre significa ejecutar las instrucciones dentro del bucle. Por ejemplo, en Unity por cada frame se invoca el m茅todo Update() de cada objeto.

ciclos --> realizar una accion mientras cumpla una condicion

este man va ta rapido que no entiendo ni una mierd4

Interesante lo que se viene.

  • El ciclo repetir谩 un fragmento de c贸digo tantas veces como sea necesario hasta que deje de complirse la condici贸n inicial.**

me encanta como vamos avanzando , hasta aqui va mi aporte y continuamos 馃槃

//funciones
function initial(jugador) {
    let nuevoIngreso = prompt(jugador);
    while (nuevoIngreso <= 0 || nuevoIngreso > 3 || nuevoIngreso == null || nuevoIngreso == "") {
        alert("INGRERSA DATO CORRECTO");
        nuevoIngreso = prompt(jugador);
    }
    return jugadorvar = nuevoIngreso;
}

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

function playGame(jugadas) {
    let election = "";
    jugadas == 1 ? election = "馃" : jugadas == 2 ? election = "馃搫" : jugadas == 3 ? election = "鉁傦笍" : "";
    return election;
}

function combat() {
    jugadorvar == pc ? alert("EMPATE") : (jugadorvar == 1 && pc == 3 || jugadorvar == 2 && pc == 1 || jugadorvar == 3 && pc == 2) ? win++ + alert("GANASTE") : lose++ + alert("PERDISTE");
}

function ganador() {
    win > lose ? alert(`ganadas => ${win} , perdidas => ${lose}`) + alert("YOU WIN 馃弳") : lose > win ? alert(`ganadas => ${win} , perdidas => ${lose}`) + alert("YOU LOSE 馃拃") : "";
}

//variables
let jugador = "elige:  1) para 馃  2) para 馃搫  3) para 鉁傦笍"
let jugadorvar = 0;
let win = 0;
let lose = 0;

// inicializando
while (win < 3 && lose < 3) {
    pc = aleatorio(1, 3);
    initial(jugador);
    alert(`Pc elegiste ${playGame(pc)}`);
    alert(`elegiste  ${playGame(jugadorvar)}`);
    combat();
}
ganador();

cuando dijo que cerr谩bamos ciclos cortandonos el pelo si soy porq me lo corte a los hombros

sera que con este curso ya aprendo a programar o falta otro?

uwu

Es muy buena la explicacion de los ciclos y hay que tomar en cuenta en que ocasiones sera mas conveniente utilizar una u otra

El famoso 鈥渂ucle鈥 鉃

Se me descompuso el contador de hambre 馃ゲ馃ゲ馃ゲ

Aqu铆 va mi aporte con la reducci贸n que pude hacer (sin perder el humor del juego鈥)

Espero les guste鈥 Si pueden comprimirlo m谩s estar铆a encantado de entender c贸mo lo har铆an.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Piedra, papel o tijera</title>
        <script>
        // Lugar para poner las funciones
            // Definici贸n de Funciones
            function aleatorio (min, max) {
                 return Math.floor( Math.random() * (max - min + 1) + min)
            }

            function elccion(jugada) {
                let resultado = ""
                // Condicionales de usuario
                if(jugada == 1) {
                    resultado = "馃piedra鉁"
                } else if(jugada == 2) {
                    resultado = "馃Щpara papel馃枑锔"
                } else if(jugada == 3) {
                    resultado = "鉁傦笍tijera鉁岋笍"
                } else {
                    resultado = "馃珷 No sabe jugar o quiere perder...馃槖"
                }
                return resultado
            }

            // Definici贸n de variables
            let jugador = 0
            let pc = 0
            let win = 0
            let lose = 0
           
            while (win < 3 && lose <3){
                pc = aleatorio(1, 3)
                // Pregunta del sistema
                jugador = prompt("Escribe: 1 para 馃piedra鉁, 2 馃Щpara papel馃枑锔 y 3 para 鉁傦笍tijera鉁岋笍") 
                //alert("elegiste" + jugador)
                alert("PC elige: " + elccion(pc))           
                alert("Mi perro eligi贸: " + elccion(jugador))           
                // Combate
                if(jugador == pc) {
                    alert("Mi perro empat贸 馃")
                } else if(jugador == 1 && pc == 3 || jugador == 2 && pc == 1 || jugador == 3 && pc == 2) {
                    alert("Mi perro gan贸 la buena 馃piedra鉁 nunca falla")
                    win++
                } else {
                    alert("Mi perro perdi贸")
                    lose++
                }
            } 
            alert("Mi perro gan贸 " + win + " y perdi贸 " + lose)
        
        </script>

    </head>
    <body>
        <h1>Piedra, papel o tijera</h1>
    </body>
</html>

Hola!
Este es mi intento de utilizar el ciclo do while para realizar lo que comenta Freddy en el video.
.
Cualquier comentario es bienvenido.
.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Piedra, papel o tijera.</title>
    </head>
    <body>
        <h1></h1>
        <p></p>
        <script>
            function aleatorio(min, max) {
                return Math.floor( Math.random() * (max - min + 1) + min)
            }
          
            function eleccionJugadorPc(numero) {
            let resultado = 0
              if(numero == 1) {
                resultado = "Piedra"
              } else if(numero == 2) {
                resultado = "Papel"
              } else if(numero == 3) {
                resultado = "Tijeras"
              } else {
                resultado = "ERROR"
              }
              return resultado
              }

            function combate (pc,jugador) {
              resultadoCombate = 0
              if(pc == jugador) {
                resultadoCombate = "Empate"
             } else if(jugador == 1 && pc == 3) {
                resultadoCombate = "Tu ganaste!"
             } else if(jugador == 2 && pc == 1) {
                resultadoCombate = "Tu ganaste!"
             } else if(jugador == 3 && pc == 2) {
                resultadoCombate = "Tu ganaste!"
             } else {
                resultadoCombate = "Perdiste! :("
             }
              return resultadoCombate
            }

            var round = 1

            do {
            var jugador = 0
            let pc = aleatorio(1,3)
            alert("Round n煤mero: " + round)
            jugador = prompt("Elige: 1 para Piedra, 2 para Papel y 3 para Tijeras.")
            alert("Tu elejiste: " + eleccionJugadorPc(jugador))
            alert("El PC eligio: " + eleccionJugadorPc(pc))
            alert(combate(pc,jugador))
            round++;
            }

            while (round <= 3);
        </script>
    </body>
</html>

Los ciclos son pedazos de c贸digo que se ejecutan hasta que se cumpla o se deje de cumplir una condici贸n.

excelente

<code> <!DOCTYPE html>
    <html>
        <head> 
            <meta charset="utf-8" />
            <title>驴Que Probabilidad Hay?</title>
            <script>
                function probable(inf, sup) {
                    return Math.floor(Math.random() * (sup - inf + 1) + inf)
                }
                function faraon(love) {
                    let shady = ""
                    if (love == 1) {
                        shady = "elegiste 1"
                    }else if (love == 2) {
                        shady = "elegiste 2"
                    }else if (love == 3) {
                        shady = "elegiste 3"
                    }else {
                        shady = "no elegiste correctamente, recarga la pajina"
                    }
                }
                let participante = 0
                let pregunta = ""
                let sup = 3
                let inf = 1
                let robot = probable(1,3)
                alert("驴...que probabilidad hay...?")
                alert("acuerdate que tienes que hacer una pregunta como: que probabilidad hay de que -- seas mi amigo? ASI QUE VAMOS!!!")
                pregunta = prompt("Que probabilidad hay de que...?")
                participante = prompt("elige numero de 1-3")
                    if (participante == 1) {
                        alert("elegiste el numero 1")
                    }else if (participante == 2) {
                        alert("elegiste el numero 2")
                    }else if (participante == 3) {
                        alert("elegiste el numero 3")
                    }else {
                        alert("no elegiste un numero o elegiste mal")
                    }
                    if (pregunta == "") {
                        alert("no preguntaste nada") 
                    }
                alert("Que probabilidad hay de que " + pregunta)

                alert("(1)...uno...(1)")
                alert("(2)...dos...(2)")
                alert("(3)...tres...(3)")

                //probabilidad
                if (robot == participante) {
                    alert("***hay probabilidad***")
                }else {
                    alert("####no hay probabilidad###")
                }

            </script>
        </head>
        <body>
            <h1>***Que probabilidad hay***</h1>
            <p>que probabilidad hay de que te guste este juego</p>
            <p>recarga para volver a jugar</p>
            <p>...</p>
            <p>creo que si hay probabilidad de que sigas jugando</p>
            <p>recarga jejeje adios UwU</p>
        </body>
    </html>

aca mi juego basado en piedra papel o tijera, que probabilidad hay?
presente colombia

Excelente forma de ense帽ar.

excelente clase

Que buena explicaci贸n.

Jaja a este loop le agregar铆a el da帽o al h铆gado y a los ri帽ones dependiendo del nivel de calidad de lo que comemos. a eso agregarle una base de datos que contenga la informaci贸n de cada alimento en el plato.

ning煤n ciclo es infinito - y nada es eterno en el mundooo jajaja Dario Gomez ( cantante colombiano musica popular) min 1:54