Intermediate Algorithm Scripting: Diff Two Arrays. How is it not filtering?

Tell us what’s happening:

Hello I’m currently on the second challenge of the intermediate algorithm scripting section. I have ran into a problem and that is me trying to figure out how to properly filter out the array of number(or items).

I have searched on the web and looked on specific pages about removing duplicates from an array using .filter, however despite me doing the same thing I read from the page or thread it still doesn’t filter out the duplicates in the array. I have tried different methods and ideas but still it comes out with the full array as if nothing happened. My code is down below.

Does anyone know why this filter in my code doesn’t work? The filter works in some test file I made but not here. Not sure if it has anything to do with pushing the concatenated arrays into newArr. If there’s any links to pages I can read on about this then they would be extremely helpful.

Your code so far


function diffArray(arr1, arr2) {
var newArr = [];
// Same, same; but different.

// Merge both arrays into one then push it into newArr
newArr.push(arr1.concat(arr2));

// Remove all duplicates leaving only unique items
var filteredDups = newArr.filter((item, index) => newArr.indexOf(item) == index);

// Comes out with [1, 2, 3, 5, 1, 2, 3, 4, 5] when I want it to contain only unique items
console.log(filteredDups);
}

diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]);

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.87 Safari/537.36.

Challenge: Diff Two Arrays

Link to the challenge:
https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays

newArr.push(arr1.concat(arr2));

What happens here is that

1 - concat creates a new Array,
2 - you add that array inside newArray.

So, you are effectively creating an array inside another array, something like:

[ [1,2,3 ...] ]

Meaning that, when you filter, the element you are looking upon are not the “individual values”, but an array.

To sum it up you have:

[ [ 1,2,3 ...] ]

// vs

[1,2,3 ...]

edit:

Also note this challenge is looking for " a new array with any items only found in one of the two given arrays, but not both"

[1, 2, 3, 5], [1, 2, 3, 4, 5] should return [4]

You have a couple of problems.

The first problem is after this line executes, you end up creating a two-dimensional array instead of a one-dimensional array. For the following test case:

diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]);

after the above line executes, newwArr looks like below:

[ [ 1, 2, 3, 5, 1, 2, 3, 4, 5 ] ]

So, your filter does not end up dropping any of the elements of newArr and the function returns the above array.

Once you resolve the first problem, your filter callback function’s logic is not correct. Can you explain why you think returning the following expression will keep only unique values between the two arrays? If you are still convinced it should work, then add a console.log statement like below, so you can see what the values of the expression are during each iteration to better understand what is happening.

var filteredDups = newArr.filter((item, index) => {
  console.log(item, index, newArr.indexOf(item), newArr.indexOf(item) == index);
  return newArr.indexOf(item) == index
});