Question : How do I get Comparison Operators working in JavaScript?

I am learning how to make small games and decided to start with JavaScript. I'm working on the high score display. I have the function do a IF statement that will compare the current score to the high score. However if I use Logical operators (&& and ||) it works fine, but if I use < or > it just doesn't work. Any help would be great! Thanks!

Code Snippet:

         
           
           
             function gameOver() {
    //end the game by clearing the timer and modifying the score label
    //If score is higher then high score, replaces the high score
    clearTimeout(timer);
    score.innerHTML += "     - Game Over";
    score.style.backgroundColor = 'rgb(128,0,0)';
    if (currentScore || hiScore && currentScore <= hiScore) {
         hiScore.innerHTML = 'High Score: ' + currentScore
    }
    
    hiScore.style.backgroundColor = 'rgb(128,0,0)';
}

           
         

Open in New Window Select All

Answer : How do I get Comparison Operators working in JavaScript?

The problem was that hiScore referred to a DIV element of which the value had text in it so the solution was to add a separate variable named highScore in this case which will keep track of the numeric value for the high score, the update is just in the rebound.js which is below, try to see if now acts correctly:

                       
         
           
             1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
137:
138:
139:
140:
141:
142:
143:
144:
145:
146:
147:
148:
149:
150:

           
           
             //get info, process data, update screen objects
//instance vars
var ball;
var paddle;
var score;
var hiScore;
 
//initial speeds
var dx = 6;
var dy = 6;
var currentScore = 0;
var highScore = 0;
var timer;
 
//set initial conditions for ball and paddle
var paddleLeft = 228;
var ballLeft = 200;
var ballTop = 4;
 
function init() {
    //instantiate HTML object instance vars
    ball = document.getElementById('ball');
    paddle = document.getElementById('paddle');
    score = document.getElementById('score');
    hiScore = document.getElementById('hiScore');
    //resister key listener with document object
    document.onkeydown = keyListener;
    //start the game loop
    start();
}
 
function keyListener(e) {
    if (!e) {
        //for IE
        e = window.event;
    }
    if (e.keyCode == 37 && paddleLeft > 0) {
        //keycode 37 is left arrow
        paddleLeft -= 10;
        paddle.style.left = paddleLeft + 'px';
    }
    if (e.keyCode == 39 && paddleLeft < 436) {
        //keycode 39 is right arrow
        paddleLeft += 10;
        paddle.style.left = paddleLeft + "px";
    }
    // FYI - Keycode 38 is up arrow,
    //       Keycode 40 is down arrow
}
 
 
 
function start() {
    //game loop
    detectCollisions();
    render();
    difficulty();
 
    //end conditions
    if (ballTop < 470) {
        //still in play - keep the loop going
        timer = setTimeout('start()', 50);
    }
    else {
        gameOver();
    }
}
 
function detectCollisions() {
    //just reflect the ball on a collision
    //a more robust engine could change trajectory of
    //the ball based on where the ball hits the paddle
    if (collisionX())
        dx = dx * -1;
    if (collisionY())
        dy = dy * -1;
}
 
function collisionX() {
    //check left and right boundaries
    if (ballLeft < 4 || ballLeft > 480)
        return true;
    return false;
}
 
function collisionY() {
    //check if at top of playing area
    if(ballTop < 4)
    return true;
    //check to see if ball collided with paddle
    if(ballTop >450) {
        if(ballLeft > paddleLeft && ballLeft < paddleLeft + 64)
            return true;
        }
    return false;
}
 
function render() {
    moveBall();
    updateScore();
}
 
function moveBall() {
    ballLeft += dx;
    ballTop += dy;
    ball.style.left = ballLeft;
    ball.style.top = ballTop;
}
 
function updateScore() {
    currentScore += 10;
    score.innerHTML = 'Score: ' + currentScore;
}
 
function difficulty() {
    //as the game progresses, increase magnitude of the vertical speed
    if (currentScore % 1000 == 0) {
        if (dy > 0)
            dy += 1;
        else
            dy -= 1;
    }
}
 
function gameOver() {
    //end the game by clearing the timer and modifying the score label
    //If score is higher then high score, replaces the high score
    clearTimeout(timer);
    score.innerHTML += "     - Game Over";
    score.style.backgroundColor = 'rgb(128,0,0)';
    if (parseInt(currentScore) >= parseInt(highScore)) {
	highScore = currentScore;
        hiScore.innerHTML = 'High Score: ' + highScore;
    }
    
    hiScore.style.backgroundColor = 'rgb(128,0,0)';
}
 
function resetg() {
    //Resets the game back to it's starting points but leaves the high score
    
    currentScore = 0;
    paddleLeft = 228;
    ballLeft = 200;
    ballTop = 4;
    start();
    score.style.backgroundColor = 'rgb(32,128,64)';
    hiScore.style.backgroundColor = 'rgb(32,128,64)';
 
}

           
         

Open in New Window Select All