Why this simple IF statement won't work?

I was solving the Falsy Bouncer (Basic Algorithm), but then this little headscratcher appears (this was my callback function for filter() method):

function bouncer(arr) {
   var returnArr = arr.filter(falsyCheck);
   console.log(returnArr);
   return returnArr;

   function falsyCheck(value) {
      var element = new Boolean(value);
      console.log("Value: " + value);
      console.log("Boolean converted to: " + element);
      
      if (element) {
         console.log("Return true\n------------");
         return true;
      }
      
      console.log("Return false");
      return false;
   }
}

bouncer([7, "ate", "", false, 9]);

The if statement doesn’t work. Even if the element = false, it still runs the if block :unamused:

But if I type if (element == true) than it goes as expected - doesn’t run the if block when
element = false. Why?
(I left the console.log() function if you want to check it out)


This whole code can be refactored to this - because filter() method does the coercion itself - someone may find this useful:

function bouncer(arr) {
   var returnArr = arr.filter(falsyCheck);
   console.log(returnArr);
   return returnArr;

   function falsyCheck(value) {
      return value;
   }
}

bouncer([7, "ate", "", false, 9]);

I’m scratching my head a little at the apparent contradiction. But I notice that if you replace if (element) with if (element == true) it behaves as expected. (If you replace it with if (element === true), everything fails.) Obviously it has to do with how JS evaluates truthiness.

I feel like I’ve run into this before, the idea of if(x) not being a good enough test. It could be that one of these helps:



1 Like

I’m gonna go with:
The second function works while the first doesn’t because: in the second function you’re evaluating the actual value from the array; in the first function you’ve assigned that value to a variable and evaluated that. if(element)? Well yes, element exists, even if its value is a falsy value, and that makes if(element a truthy evaluation. See https://developer.mozilla.org/en-US/docs/Glossary/Truthy and https://developer.mozilla.org/en-US/docs/Glossary/Falsy.

1 Like

Actually… Docs for Boolean object… should’ve read that… link is even included in the algorithm task’s text:

Do not use a Boolean object to convert a non-boolean value to a boolean value. Instead, use Boolean as a function to perform this task

var x = Boolean(expression);     // preferred
var x = new Boolean(expression); // don't use

If you specify any object, including a Boolean object whose value is false, as the initial value of a Boolean object, the new Boolean object has a value of true.

var myFalse = new Boolean(false);   // initial value of false
var g = new Boolean(myFalse);       // initial value of true
var myString = new String('Hello'); // string object
var s = new Boolean(myString);      // initial value of true

So this is where rabbit was hiding :relaxed:

So the statement should’ve been, without the new keyword:
var element = Boolean(value);

2 Likes

Side note: you don’t need the boolean constructor at all. if (value) will test the truthiness of the input.

Interesting, thanks :slight_smile: