Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

438
Views
filter and includes in array, how does that work?

I'm trying to understand how filter() and includes() work with arrays in javascript but english isn't my native language so I would really appreciate it if someone could explain the example below to me like I was 5:

const removeFromArray = function(...num) {
    let array = num[0];
    return array.filter(val => !num.includes(val))
};

This function takes an array and some other arguments then removes the other arguments from that array for example removeFromArray([1, 2, 3, 4], 3) should remove 3 and return [1,2,4]

How does this part work?

return array.filter(val => !num.includes(val))

Why the exclamation mark and also how do those two methods work together?

about 4 years ago · Santiago Gelvez
3 answers
Answer question

0

I think the key to understanding what is going on is the parameter(s) of the function, num. The code uses a nice trick that I have not encountered before. So, num is:

[[1, 2, 3, 4], 3];

a 1D array with TWO elements: [1, 2, 3, 4] at index 0, and 3 at index 1. As a result:

num.includes([1, 2, 3, 4]) // is true
num.includes(3) // is true
num.includes(anything-else) // is false

The Array#includes method determines whether an array includes a certain value among its entries, returning true or false as appropriate.

In the simplest form, whenever a boolean expression is prefixed with !, the result of the expression is negated. For example:

!num.includes(3) // becomes false

The Array#filter method creates a new array with all elements that pass the test implemented by the provided function.

Pass the test simply means return true.

Now we are ready to look at num[0].filter(val => !num.includes(val)). Or:

[1, 2, 3, 4].filter(val => !num.includes(val))

Please recall that ONLY 3 and [1, 2, 3, 4] return true to:

num.includes(val)

Hence of all the elements of num[0] or [1, 2, 3, 4] only 3 returns false to the negated expression:

!num.includes(val)

1, 2, and 4 return true or !false, meaning that they pass the test and hence will be returned by the function:

[1, 2, 4];

Please note that val => !num.includes(val) is a shorthand way of writing:

function( val ) {
    return !num.includes(val);
}

const removeFromArray = function(...num) {
    let array = num[0];
    return array.filter(val => !num.includes(val))
};

console.log( removeFromArray([1, 2, 3, 4], 3) );

about 4 years ago · Santiago Gelvez Report

0

Rest parameters shouldn't be used like that, it should only be used for like values. So, the array should be accepted separately and only the numbers to remove should be accepted using rest (refer to the snippet below).

The includes() method determines whether an array includes a certain value among its entries, returning true or false as appropriate.

So, we simply filter out numbers that are not present in the itemsToRemove array.

const removeFromArray = (array, ...itemsToRemove) =>
  array.filter((item) => !itemsToRemove.includes(item));

removeFromArray([1, 2, 3, 4], 3, 2);

about 4 years ago · Santiago Gelvez Report

0

! means "not". If something is falsy (null, 0, false, an empty string), then !something returns true. This leads to a really strange looking "cheat code" where you can convert any value to a boolean (i.e. truthy to true and falsy to false) via !!value. One exclamation point converts it to a boolean value that's true if value is falsy, then the second exclamation point changes true to false (or false to true)!

array.prototype.filter requires a function to be evaluated against each element and returns an array of only the elements where the supplied function returns a truthy value.

It might be easier to think of the following code that is nearly equivalent to yours...

const removeFromArray = function(array, ...valsToRemove) {

  const isValToKeep = val => array.includes(val) === false;
  
  return array.filter(isValToKeep)
};

The only difference in this code, besides being longer, is that the first argument won't be looked for within the first argument. Consider

const a1 = [1,2,3];
a1.push(a1); // appends itself as its last element

In your version, removeFromArray(a1, 2) would return [1, 3], but mine doesn't combine the first argument as one of the elements to look for and remove from the first argument, which is probably what most people would expect and be more performant, but would definitely have a different effect in the example returning [1, 3, a1], i.e. [1, 3, [1, 2, 3, [1, 2, 3, [1, 2, 3, [1, 2, 3, [1, 2, 3, [1, 2, 3, [...]]]]]]]]

about 4 years ago · Santiago Gelvez Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!