If statement treating true as false

Question

I have stumbled across an extremely strange occurrence in Javascript that I can't make head or tail of.

Here's a very simple if statement:

let hours = 20;

I put a breakpoint here, and set hours = 0 in the debugger. I test !hours in the debugger to confirm the result is true, and click continue to run through the if statement.

if (!hours) {
  console.log("Hours is false: " + hours);
} else {
  console.log("Hours is true: " + hours);
}

Expected result to be logged:

Hours is false: 0

Actual result logged:

Hours is true: 0

^ Mouse is hovering over hours so current value is visible

This only happens when hours was originally set to an integer, and then set to 0 in the debugger. Does Javascript have some obscure rule about truthy values retaining their status even after being changed?

Or is this a discrepancy between the debugger and the code (which, if true, would basically defeat the point of the console)?

Why on earth is this happening?

i think when you put in debugger and try to change it wont affect so basically you have value will 20 itself thats why it showing the true case — Learner, Jan 08 '20 at 11:50
@Teemu, how do you know this? It is common though. I agree. Lots if bugs are because the type is string and not int but thats normally in the browser after html had its finger in play. — The Fool, Jan 08 '20 at 11:50
@DILEEPTHOMAS After changing the value in the debugger, `hours` shows 0 when I hover over it with the mouse — half of a glazier, Jan 08 '20 at 11:51
https://stackoverflow.com/questions/4603021/is-it-possible-to-change-javascript-variable-values-while-debugging-in-google-ch, check this one — Learner, Jan 08 '20 at 11:51
I think in the latest version it will work, i think as teemu mentioned it can be a string check the typeof — Learner, Jan 08 '20 at 11:53

score 2 · Accepted Answer · answered Jan 08 '20 at 11:55

2

Check this one, open the devtools and run the code snippet, change the scope value to 0 or in the console put hours = 0. Both will work tested it

Chrom version : Version 79.0.3945.88 (Official Build) (64-bit)

let hours = 20;
debugger
if (!hours) {
  console.log("Hours is false: " + hours);
} else {
  console.log("Hours is true: " + hours);
}

answered Jan 08 '20 at 11:55

Learner

8,379
7
44
82

That gives expected answer... But doesn't that defeat the purpose of the debugger? – half of a glazier Jan 08 '20 at 11:57
then can you explain what you are trying to achieve ? – Learner Jan 08 '20 at 11:58
This answered my question. However I'm trying to understand - the point of the debugger is to be able to test code as it runs normally. If the debugger doesn't test as the code would run, what's the point of it?? – half of a glazier Jan 08 '20 at 12:00
debugger is basically to help you whats happening in each step, its your wish you need to override or not, i feel it as a feature so assume if at the run time you have if else block when you update the value to check whether it works in both condition as you required so i feel debugger is doing the actual purpose it requires its a tool basically how you use it. Like a famous quote if you give a knife to doctor he will save you if you give to murderer he will kill you !!! – Learner Jan 08 '20 at 12:04

score 0 · Answer 2 · answered Jan 08 '20 at 11:51

0

Have you carefully parsed the hours received ?

!0 === false
!"0" === true
!parseInt("0") === false

Have you computed string as if it was integer ?

"0" +  0  === "00"
 0  + "0" === 0
+"0" + 0  === 0

answered Jan 08 '20 at 11:51

karkael

431
2
9

Lokesh Suman · Answer 3 · 2020-01-08T12:18:07.280

0

if (!hours) {
    console.log("Hours is false: " + hours);
} else {
    console.log("Hours is true: " + hours);
}

if hours = 1 then

hours is true: 1

or if hours = 0 then

hours is false: 0

or if hours = 20 then

hours is true: 20

edited Jan 08 '20 at 12:18

answered Jan 08 '20 at 11:54

Lokesh Suman

493
5
14

score 0 · Answer 4 · answered Jan 08 '20 at 12:00

0

I put a breakpoint here, and set hours = 0 in the debugger.

And that's probably the source of confusion. If your "here" is after the code tested the value of x, then your changing the value of x doesn't affect which branch gets executed.

answered Jan 08 '20 at 12:00

mbojko

13,503
1
16
26

The breakpoint is before the code tested the value. Like I pointed out earlier, `hours` is actually 0 when it's being analysed in the if statement – half of a glazier Jan 08 '20 at 12:01
Care to share a screenshot? – mbojko Jan 08 '20 at 12:03
Screenshot added to question – half of a glazier Jan 08 '20 at 12:08
Your screenshot shows @DILEEP THOMAS's solution, which, according to yourself, solves the problem... – mbojko Jan 08 '20 at 12:13

Styler · Answer 5 · 2020-01-08T12:10:46.603

-1

You have to check the data type:

typeof hours;

0 as number return false in if statement, that's why with ! it return true.

var number = 0;
if (number) console.log(true); else console.log(false);
output -> false
if (!number) console.log(true); else console.log(false);
output -> true

That's clear JS.

edited Jan 08 '20 at 12:10

answered Jan 08 '20 at 11:55

Styler

32
3

it returns `number` – half of a glazier Jan 08 '20 at 11:55
0 as number return false in if statement, that's why with ! it return true. – Styler Jan 08 '20 at 12:06
And that is the problem - it *should* return true but actually it's going to false – half of a glazier Jan 08 '20 at 12:08
It's going to false because 20 is truthly so with ! it's false. For 0 it's false so with ! it's true. – Styler Jan 08 '20 at 12:10

If statement treating true as false

5 Answers5