Okay, time to tie it all together. Here’s our exercise, know as Seek & Destroy in the FreeCodeCamp curriculum.
NOTE: IF YOU HAVEN’T COMPLETED THIS – Go and try it first. If you just copy my solution, you won’t learn anything, and when it comes time to interview, you won’t pass the coding test.
“You will be provided with an initial array (the first argument in the destroyer function), followed by one or more arguments. Remove all elements from the initial array that are of the same value as these arguments.”
The last line is a call to the destroyer function with an array. They’ll also be testing several other arrays to make sure you wrote it correctly. Now, we know that arr is going to contain the arguments we are sending to the destroyer function, namely [1, 2, 3, 1, 2, 3], 2, 3. We know that we’ll use the arguments object to refer to them. We also know that we’re writing a filter() function with the name “destroyer”. We’re going to return a modified arr as the result. And that’s what we’re given to play with! Let’s get started…
Well, let’s see. We want to compare the elements in the array with the elements that follow it in arr. We don’t know ahead of time how many arguments will be sent to the destroyer function (there are other tests on the FreeCodeCamp page with different arguments than the one above, and some have two and some have three arguments). How to do this?
Well, we can create a second array with the elements that aren’t in the array we sent to destroyer, and then compare the two arrays, removing the elements in the first array that match the ones in the second array. This is our filter. Let’s create the array, which we’ll call args:
Now, we’ll populate it, by starting at element of the arguments object (because element is the array we want to which we want to compare args).
We are “pushing” each element after element into the args array. Note that the push() method is a way to put items into an array. This is a loop, using y as the counter and working through the length of the arguments object to the end. So, in our example above ([1, 2, 3, 1, 2, 3], 2, 3) we will end up with args = [2, 3].
Now, we want to actually compare the two arrays. We’re gonna need a loop. Actually, we’re going to need TWO loops, one for the elements in the first array, and one for the elements in the second array.
Nope, not quite. We need to test element against args, not arr, which is the array AND the elements we want to test it against. Let’s modify our program and assign element (the array) to a separate variable:
Well, we passed three out of five tests! Getting closer. Let’s see why it’s not working. Using the console, we see that for the two cases that don’t pass, it’s the last number in the array that’s getting skipped! For example, one of the arrays is:
[2, 3, 2, 3]
and we’re comparing it to
This means we should get back an empty array, . But instead, we get back a . Ack! What’s going on???
This one is tricky. When we delete items from the array, it changes the length of the array. The program thinks it has already looked at the last item because our counter variables (1 and x) have reached the end of the array. How can we change that?
Well, we can start at the END and work back to the BEGINNING. Let’s modify the program again:
As expected, we get back an empty array!