# Need some clarification from the react course todo list!

**URL:** <https://forum.kirupa.com/t/need-some-clarification-from-the-react-course-todo-list/653073>\
**Category:** web dev\
**Created:** [August 13, 2022, 10:52am UTC](https://forum.kirupa.com/t/need-some-clarification-from-the-react-course-todo-list/653073 "2022-08-13T10:52:09Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![tbunreal](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/tbunreal/32/18076_2.png) [@tbunreal](https://forum.kirupa.com/u/tbunreal)\
**Post date:** [August 13, 2022, 10:52am UTC](https://forum.kirupa.com/t/need-some-clarification-from-the-react-course-todo-list/653073/1 "2022-08-13T10:52:09Z")

</div>

Hi, I must admit I don’t know much javascript, but I seem to be doing ok with the react course. But I am having some trouble understanding this code from the todo list project.  
[Here](https://www.kirupa.com/react/simple_todo_app_react.htm)  
The code is:

```auto
var filteredItems = this.state.items.filter(function (item) {
  return (item.key !== key);
});

```

I understand it gets the clicked item from the user and compares that item from the list of items and returns a list without that item effectively removing it. I’m just having trouble understanding the syntax. I don’t understand specifically this part:

```auto
(function (item) {
  return (item.key !== key);
});

```

What is function item? how are we getting keys from it and what key are we comparing it to? Thanks

And a little bonus question. If I’m understanding the =\> operator correctly then can it be written like this?

```auto
var filteredItems = this.state.items.filter((item) => {
  return (item.key !== key);
});

```

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [August 13, 2022, 3:38pm UTC](https://forum.kirupa.com/t/need-some-clarification-from-the-react-course-todo-list/653073/2 "2022-08-13T15:38:09Z")

</div>

Welcome to the forums @tbunreal 🙂

Yes! You have the arrow function example perfect. For some other syntax variations, especially given that this is a single statement, you can go even more concise:

```auto
var filteredItems = this.state.items.filter(item => return (item.key !== key););

```

This article shows all of the variations you can use: [Arrow Functions in JavaScript](https://www.kirupa.com/javascript/arrow_functions.htm)

The `filter` method takes a function as its argument, and what we specified here is an _ **anonymous** _ function. This function will perform whatever operation you specify on the item without being explicitly named. To go deeper on `filter`, this dedicated article on it can help: [Mapping, Filtering, and Reducing Things in an Array](https://www.kirupa.com/html5/arrays_map_filter_reduce.htm)

🙂

---

<div class="post-metadata">

**Author:** ![tbunreal](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/tbunreal/32/18076_2.png) [@tbunreal](https://forum.kirupa.com/u/tbunreal)\
**Post date:** [August 13, 2022, 3:45pm UTC](https://forum.kirupa.com/t/need-some-clarification-from-the-react-course-todo-list/653073/3 "2022-08-13T15:45:15Z")

</div>

Thanks for responding! I’m just about to go to bed, but I’ll look into what you said later, thank you