Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript React Basics Understanding State Remove Items From State

p => p.id !== id

I was following along until this argument passed to the filter method.

.filter(p => p.id !== id)

Can someone elaborate on this?

Thanks!

2 Answers

stjarnan
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
stjarnan
Front End Web Development Techdegree Graduate 56,488 Points

Hi Brevans,

You're probably using .filter on an array of objects? Correct?

In this case filter takes your array and goes through each item (which you call p in your parameter), checking the items(p) to see if that particular item has got a key called id that doesn't match with whatever your id variable consists of.

Basically, your array contains objects with the key 'id'. Every item your filter goes through will be called 'p' in your function. And that function will see if the current item contains an id (p.id) that doesn't match (!==) with whatever you have stored in your id variable.

I'm writing this in a hurry before going to the gym, tried to make it easy but might have made it hard for you to understand. Does it help you?

Jonas

To expand on what Jonas said,

Remember that filter(), returns a separate array!! So the purpose of running filter with this conditional, is to return a new 'Players' array, this time without the player whose ID was passed to it.

In other words, create a new array, but do not include the player with this specific ID. This passed, or specific, ID is determined by the 'Delete' buttons function of the associated player. Because we are, after all, trying to delete that player from the list.

Hey @brevans26,

As you probably noticed, the .filter function accepts a function as an argument (MDN Doc on .filter), and then returns a new array with ONLY the filtered items matching the criteria in the function passed as the argument

p => p.id !== id is basically a new way of writing functions in javascript

I would recommend that you watch this 8-min video on the arrow syntax in ES6: https://teamtreehouse.com/library/introducing-arrow-function-syntax

It should help you give a better understanding of what p => p.id !== id means

Spoiler: It basically is same as:

function(p){
  return p.id !== id
}

// with the `this` context bound from the parent