Question

Before anyone jumps in to answer and bash me for asking a silly question; I’m aware of what the not operator does, at least in other languages it should invert a result from true to false and vice versa. The thing I’m stuck on is the strange behavior I get from time to time. I.e. I had this in my code. It’s not doing what I expect it to do.

_checkOnOff: function(inst) {
    return (!$.suggestBox.onOff || !$.suggestBox._get(inst, 'onOff')) ?  false : true;
},

The actual values for the ‘onOff’ variables that I’m dealing with here are 0 and 1. I’m assuming that the ‘!’ operator will reverse them.

However I couldn’t get it to work until I changed the function to explicitly state ‘== 0’ like so…

_checkOnOff: function(inst) {
    return ($.suggestBox.onOff == 0 || $.suggestBox._get(inst, 'onOff') == 0) ?  false : true;
},

Edit: Added info Both $.suggestBox.onOff and $.suggestBox._get(inst, ‘onOff’) will be either 0 or 1.

My question is why didn’t !$.suggestBox.onOff produce true when $.suggestBox.onOff was equal to 0? Is Javascript ! equivalant to the bitwise operator?

Edit: Second attempt

I tried using ‘!!’ like was suggested (to get a bool) and found nothing changed. Here is the code and outputs:

        console.log('val: ' + $.suggestBox.onOff);  // outputs: 0
        console.log('! : ' + !$.suggestBox.onOff);  // outputs: false
        console.log('!! : ' + !!$.suggestBox.onOff);   //outputs: true
        console.log('!!! : ' + !!!$.suggestBox.onOff);   //outputs: false

The output doesn’t change if $.suggestBox.onOff is 1 or 0!!! it’s still false, true, false. What is going on?!

Edit: Third attempt I found out that it has something to do with my variable. I don’t know how, but it has to do with the way that it has been set. Ok, prepare yourselves, what I’m about to tell you, may very well blow your mind and change the way you type on the keyboard. It’s that incredible:

        //this.onOff = 0;
        console.log('this.onOff: ' + this.onOff);   //output: 0
        console.log('! : ' + ! this.onOff);  //output: false
        console.log('!! : ' + !! this.onOff);   //output: true

If I uncomment out the ‘this.onOff = 0’, thereby explicitly assigning this.onOff to a literal, it changes the output to:

• 0
• true
• false

I just found out why. I will write it down in the answer section. Small clue is that it’s the way the variable $.suggestBox.onOff was set.

Answer 1

It seems that $.suggestBox.onOff is set with "0" as a string, which in JavaScript is always truthy.

Since "0" is truthy and 0 is falsy, you’d expect 0 == "0" to be false, but it’s not.

Try the following in your console:

!! "0"; // true
!! 0; // false
0 == "0"; // true

Weird? Yes. Welcome to the awkward world of JavaScript!

---

To get around this issue, you should either have $.suggestBox.onOff be an actual number, or convert it on the fly:

_checkOnOff: function(inst) {
    return !! ( +$.suggestBox.onOff && +$.suggestBox._get(inst, 'onOff') );
}

---

Update: Since you pointed out in the comments that you’re setting it by a text value, use this when setting it so that it’s always set as a number:

$.suggestBox.onOff = +$(this).val();