hola mi pelota se queda revotando en 600 , mire la solución del profe pero no la entiendo

¡Hola Katherine! ¿cómo estás?

La situación que estás enfrentando se debe a un error de lógica en el código. En particular, cuando el objeto alcanza la posición de 600 píxeles, el código hace que el objeto vuelva hacia atrás. Sin embargo, cuando el objeto alcanza la posición de 599 píxeles, la primera condición definida en el código se activa y se le suma 1 píxel, lo que provoca que el objeto se quede atrapado en un bucle infinito de subir y bajar 1 píxel. Para solucionar este problema, es necesario ajustar las condiciones en el código de manera que el objeto no quede atrapado en este ciclo sin fin.

Una solución efectiva para solucionar el problema es mediante el uso de una variable de "sentido" o "dirección". Esta variable puede tomar un valor positivo para indicar que el objeto debe moverse hacia adelante, y un valor negativo para indicar que debe moverse hacia atrás. De esta manera, podemos evitar que el objeto se quede atrapado en un bucle infinito. Al utilizar la variable de sentido, podemos asegurarnos de que el objeto siempre se mueva en la dirección correcta y evite los errores de lógica que pueden provocar un comportamiento inesperado en el código.

Además de utilizar la variable de sentido, también es importante crear dos condiciones adicionales en el código. La primera condición debe verificarse cuando el valor de la posición x del objeto sea menor que 0, lo que significa que el objeto se está saliendo de la pantalla hacia la izquierda. La segunda condición se activa cuando la posición x del objeto es mayor que 600, lo que indica que el objeto está superando el límite establecido para avanzar hacia la derecha. Al verificar estas dos condiciones, podemos asegurarnos de que el objeto siempre permanezca dentro de los límites de la pantalla y que no se mueva más allá de los puntos establecidos en el código.

var x=0; 
var sentido = 1;  

    function actualizarPantalla(){

         limpiarPatalla() ;

         if (x < 0){

             sentido = 1;

         } else if(x > 600){

            sentido = -1;

         }

        disenharCircunferencia(x,20,10);
        x += sentido;
    }

    setInterval(actualizarPantalla,10);

¡Saludos!

Buenisimo, me ayudo. Ahora bien que significa lo siguiente? x += sentido; O sea el simbolo += que quiere decir? Aguardo comentario. Gracias

Hola Alexis,

Es una forma más sencilla de decir:

x = x + sentido

Así se interpreta que quieres sumar el valor de la variable sentido en x sin necesitar hacer referencia a x2 veces

TE COMPARTO COMO YO LO RESOLVI ESPERO TE AYUDE A COMPRENDER MEJOR EL TEMA

<canvas width="600" height="400"> </canvas>


<script>


    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");

    pincel.fillStyle = "lightgrey";
    pincel.fillRect (0,0,600,400);


    function disenarCircunferencia (x,y,radio) {

        pincel.fillStyle = "blue";
        pincel.beginPath ();
        pincel.arc (x,y,radio,0,2*Math.PI);
        pincel.fill ();

    }

    function limpiarPantalla () {

        pincel.clearRect (0,0,600,400);
    }


    var x = 0
    var limiteDerecho = true

    function actualizarPantalla () {

        limpiarPantalla ();
        disenarCircunferencia (x,20,10);


        if (x > 500) {

            limiteDerecho = false;

        }

        if (x < 0) {

            limiteDerecho = true;

        }

        if (limiteDerecho) {

            x++;

        } else {

            x--
        }

    }


    setInterval(actualizarPantalla,10);


</script>

Muchas gracias a todos.

Debido a sus comentarios y explicación comprendí el uso de la variable del sentido.. Gracias!!!