I'm having trouble understanding some JS code in a game, please help?

MDN Learn
#1

So I’ve managed to make it as far as up to having a moving element in my road crossing game while understanding everything about how the code is making everything works until now.

Can someone explain in simple terms how the code below makes my most left blue element move up and down? I understood how it goes down, but when I had to code it going up and down, my mind gets baffled.

    moveVertically() {
        if (this.y > screenHeight - 100 || this.y < 50 ) {
            this.speed = -this.speed;
            }
        this.y += this.speed;
        }

Road Crossing Game Code and live preview

#2

@ayanda

the condition checks y value against the screenHeight and fixed value, Now as the condition is matched it always sets the value to the negative, For example

Case: If the speed value is +5
* For the first time when the condition is satisfied the value of speed is set to negative of speed, that is speed = -(+5) which is equal to -5, So now instead of adding the value to y we will now subtract value from y
* Now when again the condition is satisfied the value of speed is now -5, according to the formula speed = -(speed) the value is set to +5 since -(-5), So now we will start adding the value to y instead of subtracting it.

And this will be continued till the exit condition is not declared.