Wherefore art thou - use of map() and reduce()

Wherefore art thou - use of map() and reduce()
0
#1

Tell us what’s happening:
I looked at the advanced code solution and I just don’t understand why reduce() is necessary for the filter() method to work. When I get rid of the reduce() part of the code, all that is returned is a copy of the array that filter was called on. It seems that map() in this case returns an array of boolean values so why doesn’t filter just get rid of all the instances that return false? Why does it need reduce() to work? Could someone explain this please?

Your code so far

return collection.filter(function (obj) {
    return srcKeys
      .map(function(key) {
        return obj.hasOwnProperty(key) && obj[key] === source[key];
      })
      .reduce(function(a, b) {
        return a && b;
      });
  });

function whatIsInAName(collection, source) {
// What’s in a name?
var arr = [];
// Only change code below this line

// Only change code above this line
return arr;
}

whatIsInAName([{ first: “Romeo”, last: “Montague” }, { first: “Mercutio”, last: null }, { first: “Tybalt”, last: “Capulet” }], { last: “Capulet” });


**Your browser information:**

User Agent is: <code>Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.131 Safari/537.36</code>.

**Link to the challenge:**
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/
#2

Because an array of Boolean values is not the same as a single Boolean value. The reduce is used in this case in order to determine a final Boolean value based on the Boolean values in the array. Personally, I would skip the map and the reduce and use every, because both map and reduce iterate through the entire array (you are iterating through an array the length of srcKeys twice) and you really only need to iterate until you find a source key where obj.hasOwnProperty(key) && obj[key] === source[key] evaluates to false. As soon as the function evaluates to false, it returns false to the filter which excludes it. The every function will return true if every call to the function supplied returns true or will return false and stop iterating if along the way the function evaluates to false.

#3

Okay thanks. I get it. The filter() method cannot filler an array of boolean values. It needs reduce to be able to filter an array with a single boolean value.

#4

Just to clarify:

The filter method can filter an array of Boolean values. For example:

var booleansArr = [true, false, true, true, false, true];
var onlyTrue = booleans.filter(val => val); // [true, true, true, true]

The reduce method has the ability to “reduce” an array of booleans down to a single Boolean value.

var booleansArr = [true, false, true, true, false, true];
var finalBooleanValue = booleansArr.reduce((bool, val) => bool && val); // false

There is a way you could use the filter method to determine a final value of an array of Booleans:

var booleansArr = [true, false, true, true, false, true];
var onlyTrue = booleansArr.filter(val => val).length === booleansArr.length; // false

If the length of the both arrays are equal, then all the values in the array had to be true, otherwise there was at least one false value.

A more concise (yet maybe not as readable) way to use the filter method would be:

var booleansArr = [true, false, true, true, false, true];
var onlyTrue = !booleansArr.filter(val => !val).length; // false