Solucionado
Yo tengo la duda de porque se debe poner x<0 en el else if, por lo entiendo logicamente debería funcionar si se coloca x=0, ya que el que aumenta el sentido y la x solo responde en una ocasión, sin embargo al intentar correrlo el programa genera un bucle y tomando siempre a x como 0 y al sentido como 1
Hola! en este caso funcionaría con x==0 (recordá que con doble "==" estamos comparando, y con "=" estamos asignando). Entonces, si haces la validación con x==0 y un incremento de 1, funciona. Pero qué pasa si decido hacerlo con un incremento de 7 y uso la misma validación para x==600? Va a llegar hasta 595 y luego saltará a 602, por lo que la pelotita seguirá de largo (ya que la condicion x==600 nunca se cumplirá) entonces no estoy cubriendo ese escenario. De la misma forma, si decido que la pelota arranque del lado derecho (x=600), con sentido inicial -1, usando el mismo incremento (saltos de 7 unidades) llegará a 5 y saltará a -2, por lo que la condición x == 0 para que cambie de sentido nunca se cumplirá y la pelota se perderá en el infinito negativo y más allá. Así, con x<0 y x>600 evitamos que sucedan estas cosas. Saludos
Muchas gracias, había olvidado lo del ==, ahora lo intente de esta forma y ahora si funciono de la manera en que quería
Buenas yo lo hice un poco diferente a la solucion del curso me gustaria que me ayuden a ver que tal.
var trueAndfalse = true;
var x = 15;
function movimiento(){
if(trueAndfall == true){
pincel.clearRect(0,0,600,600)
dibujar(x,20);
x++
if(x == 585){
trueAndfall = false
}
}
if(trueAndfall == false){
pincel.clearRect(0,0,600,600)
dibujar(x,20);
x--;
if(x == 15){
trueAndfalse = true;
}
}
}aqui esta el codigo completo para el que lo quiera provar.
<meta charset="utf-8">
<canvas id="canvas" width="600" height="600"></canvas>
<script>
var canvas = document.getElementById('canvas');
var pincel = canvas.getContext("2d");
pincel.fillStyle = 'black';
pincel.fillRect(0,0,600,600);
function dibujar(x,y){
pincel.fillStyle = 'blue';
pincel.beginPath();
pincel.arc(x,y,10,0,2*Math.PI);
pincel.fill();
}
function movimientoX (){
let movimientoX = Math.round(Math.random()*600)
return movimientoX
}
function movimientoY (){
let movimientoX = Math.round(Math.random()*600)
return movimientoX
}
var trueAndfalse = true;
var x = 15;
function movimiento(){
if(trueAndfalse == true){
pincel.clearRect(0,0,600,600)
dibujar(x,20);
x++
if(x == 585){
trueAndfalse = false
}
}
if(trueAndfalse == false){
pincel.clearRect(0,0,600,600)
dibujar(x,20);
x--;
if(x == 15){
trueAndfalse = true;
}
}
}
setInterval(movimiento,20);
</script>