If / if else logic in javascript

Question

var h = game.ship.hull.hullIntegrity(); //returns int from 0-100
var hstr = h.toString()+"%";
gcp.hullIntegrity.text = hstr;
gcp.hullHealth.text = game.ship.hull.health;
//colorize data
console.log(h);
if (h === 100) {
    gcp.hullIntegrity.addColor("#05AA0D",0);
} else if (75 <= h < 100) {
    console.log("yellow: ", h + " >= 75.");
    gcp.hullIntegrity.addColor("#FFEC0D",0);
} else if (25 <= h < 75) {
    console.log("red:", h + " < 75.");
    gcp.hullIntegrity.addColor("red",0);
} else if (h < 25) {
    console.log("grey");
    gcp.hullIntegrity.addColor("grey",0);
}

I am trying to colorize the display of a canvas text object based on its value. For some reason, the previous code has the following behavior:

When h = 100, it displays green. This is correct.
When h < 100, it displays yellow. This is correct.
When h < 75, it SHOULD display red. It displays yellow.

Console.log shows:

    70
    yellow:  70 >= 75.

But 70 is obviously less than 75, so why isn't the console displaying "red"?

Why?

you have to update your if statements and use some && for example: (75 <= h && h < 100) — Snackaholic
– Snackaholic, Commented Dec 18, 2015 at 7:18
Yes, using && returns the correct code. But when I put the code through jshint.com without the &&, it didn't flag the statements as incorrect. That seems very strange to me. — cinead
– cinead, Commented Dec 18, 2015 at 7:19
everything after 75 <= h got ignored u cant do 2 comparisons without saying that you really want to do 2 of them since 75 is smaller than h each time it will be yellow :) — Snackaholic
– Snackaholic, Commented Dec 18, 2015 at 7:21

Igor Kim · Accepted Answer · 2015-12-18 07:19:04Z

3

try to use if like this

(h >= 75 && h < 100)
(h >= 25 && h < 75)

answered Dec 18, 2015 at 7:19

Igor Kim

771 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Ant P Over a year ago

The second parts of both of those expressions are redundant - those cases are already handled by the previous conditional block

Lewis Hai · Accepted Answer · 2015-12-18 07:36:11Z

1

Change your code to

var h = game.ship.hull.hullIntegrity(); //returns int from 0-100
var hstr = h.toString()+"%";
gcp.hullIntegrity.text = hstr;
gcp.hullHealth.text = game.ship.hull.health;
//colorize data
console.log(h);
if (h === 100) {
   gcp.hullIntegrity.addColor("#05AA0D",0);
} else if (h >= 75 && h < 100) {
   console.log("yellow: ", h + " >= 75.");
   gcp.hullIntegrity.addColor("#FFEC0D",0);
} else if (h >= 75 && h < 100) {
   console.log("red:", h + " < 75.");
   gcp.hullIntegrity.addColor("red",0);
} else if (h < 25) {
   console.log("grey");
   gcp.hullIntegrity.addColor("grey",0);
}

answered Dec 18, 2015 at 7:36

Lewis Hai

1,21411 silver badges23 bronze badges

Collectives™ on Stack Overflow

If / if else logic in javascript

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related