JavaScript filter arrays

Question

I'm taking online JavaScript courses and I'm curious about one of the tasks:

We'r provided with an initial array (the first argument in the destroyer function), followed by one or more arguments. We have to remove all elements from the initial array that are of the same value as these arguments.

Here's my solution, but it doesn't works:

 function destroyer(arr) {
   // Separating the array from the numbers, that are for filtering; 
   var filterArr = [];
   for (var i = 1; i < arguments.length; i++) {
     filterArr.push(arguments[i]);
   }

   // This is just to check if we got the right numbers
   console.log(filterArr);

   // Setting the parameters for the filter function
   function filterIt(value) {
       for (var j = 0; j < filterArr.length; j++) {
         if (value === filterArr[j]) {
           return false;
         }
       }
     }
     // Let's check what has been done
   return arguments[0].filter(filterIt);
 }

 destroyer([1, 2, 3, 1, 2, 3], 2, 3);

I was able to find a solution, however it doesn't makes any sense to me, that's why I'm posting this question; can you please tell me why the following code works:

function destroyer(arr) {
  // Separating the array from the numbers, that are for filtering; 
  var filterArr = [];
  for (var i = 1; i < arguments.length; i++) {
    filterArr.push(arguments[i]);
  }

  // This is just to check if we got the right numbers
  console.log(filterArr);

  // Setting the parameters for the filter function
  function filterIt(value) {
      for (var j = 0; j < filterArr.length; j++) {
        if (value === filterArr[j]) {
          return false;
        }
        // This true boolean  is what makes the code to run and I can't                  // understand why. I'll highly appreciate your explanations.
      }
      return true;
    }
    // Let's check what has been done
  return arguments[0].filter(filterIt);
}

destroyer([1, 2, 3, 1, 2, 3], 2, 3);

Thank you for the heads up!

Answer 1

You might do the same job with a relatively simple code by utilizing Array.prototype.reduce() as follows;

ES6

var destroyer = (a,...f) => a.reduce((p,c) => f.includes(c) ? p : p.concat(c),[]);
console.log(destroyer([1, 2, 3, 1, 2, 3], 2, 3));

or in ES5

function destroyer(a){
  var f = Array.prototype.slice.call(arguments,1);
  return a.reduce(function(p,c){
                    return f.indexOf(c) !== -1 ? p : p.concat(c);
                  },[]);
}
console.log(destroyer([1, 2, 3, 1, 2, 3], 2, 3));

Answer 2

filter is an Array native function. It creates a new array with all elements that pass a given test. The test function must return a boolean value, if true that value is not filtered out and if false, it is filtered out.

Go through the docs: Filter- Array

The correct solution that you have posted, has a valid test function for filtering the given array, that returns true and false, for the specific use case (here being the logic of eliminating numbers provided as arguments).

Your implementation misses returning true (which is returning undefined, a falsey value in Javscript, hence all of the values are filtered out and you get an empty array.

Note: true here refers to all truthy values in JS and false refers to all falsy values in JS.