CODEWITHSUNDEEP
javascriptjqueryhtmlif-statementboolean
Jared
Jared

Reputation: 3016

JavaScript IF statement boolean strict

I am setting a mode in a script by passing a "truthy" boolean to a function. In the function a simple if statement checks if the param is true or false. I sometimes pass it as a string or a bool which has always worked, but for some reason it isn't for this:

setMode: function(Setting) {    
    if (Setting) {
        console.log('Enabling mode');
    } else {
        console.log('Disabling mode');
    }
}

For example when I pass it a string 'false' and log Setting to console, the console says false, yet the if statement thinks it's true.

I have to add this to the start of the function for it to work:

if (typeof Setting == 'string') { Setting = (Setting == "true"); }

An example of it in use:

var inverted = $('INPUT[name="Mode"]').prop('checked');
app.setMode(inverted);

and another:

var mode = localStorage.getItem('Mode');
this.setMode(mode);

It's so bizarre since I've done this type of thing for years yet it's only starting now. Maybe because I'm using localStorage and .prop?

Upvotes: 2

Views: 2059

Answers (3)

Bergi
Bergi

Reputation: 664307

For example when I pass it a string 'false' and log it to console, the console says false, yet the if statement thinks it's true.

The console output is confusing, it is concealing the quotes and logging false both for the string "false" and the boolean false. Yet, these two are not equivalent, the string is not empty and indeed truthy.

Maybe because I'm using localStorage and .prop?

Yes. The .checked property returns a boolean and everything works well. In contrast, local storage only stores strings, and when you pass in a boolean you get back its stringification. You can undo that by using 

var modeStr = localStorage.getItem('Mode');
var mode = JSON.parse(modeStr);
this.setMode(mode);

Upvotes: 1

basilikum
basilikum

Reputation: 10528

To answer your question about string to boolean conversions:

ECMA SPEC:

The result [of this conversion] is false if the argument is the empty String (its length is zero); otherwise the result is true.

So yes, if you pass the string "false" it will be converted to true, which means the only option you have is to manually check for the strings "true" or "false" and do the conversion by yourself.

However, the jQuery function .prop("checked") is supposed to return a boolean value (or undefined if the property is not defined). So I would say you should be able to actually do 

if (elem.prop("checked"))

like here.

Upvotes: 2

Niccolò Campolungo
Niccolò Campolungo

Reputation: 12042

If you try to log 'false' it is obvious that console logs false(it is a string) and that the if statement sees true, because a not-empty string is a true boolean value.

If you want to check if the string is "true" or "false" you have to do it with normal operators. So you could add this line at the beginning of your function:

Setting = (typeof Setting === 'string') ? Setting === "true" : Setting;

Upvotes: 2

Related Questions