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 by Example Building the Application Removing Names From the List

Keith Carrillo
Keith Carrillo
6,909 Points

Could you explain why use slice twice a bit deeper?

I thought maybe slice removes element(s) and returns the rest of the array. I'm not following on what the second slice is for?

3 Answers

Would using .splice(index, 1) to remove the guest be more efficient and explicit? Why didn't he use that method?

Here's MDN's explanation of it.

Unexpectedly, splice(index, 1) returns only the guest at that index position (i.e. removing everyone else) even though MDN shows this working differently and my past use of it worked this way - it's a convenient way to remove an element anywhere in an array.

The other option is to use .filter which will return a new array with newly filtered results. So basically filter everyone BUT the object at the index you want to remove.

james south
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
james south
Front End Web Development Techdegree Graduate 33,258 Points

the two slices in conjunction with the spread operator are taking the elements of the array before the removed element and after the removed element and then putting them back together in the new array. the first slice is the elements before the removed index and the second slice is the elements that come after the removed index. the spread operator is used to copy the returned elements from each slice into the new array, so that after the operations complete you are left with a single array that no longer has the removed element.

Cristina Rosales
Cristina Rosales
10,929 Points

James South, great explanation. I was scratching my head going like "wt everloving f" for a while.

I tried the following in the console. First I defined an array of characters I like to play in Super Smash Brothers.

(5) ["Snake", "Ryu", "Ken", "Mario", "Luigi"]
//Then I sliced from the beginning to right before the one indexed at 3, meaning Mario is out of the party
ssbArray.slice(0, 3)
(3) ["Snake", "Ryu", "Ken"]
//then I slice from the index I picked (3) plus 1 == (4)
ssbArray.slice(4)
```["Luigi"]

Now it makes sense to me that if we are setting state with an array that our first chunk is the set of elements minus the one we want to ignore. The second element (or chunk of them) is all the stuff that comes after that one we want to ignore.
Keith Carrillo
Keith Carrillo
6,909 Points

So slice doesn't remove them the first time. Does it in a sense index or target it? Then the second slice is somehow passing them together with out the index/targeted element. I used splice instead. From the first introduction to React on Treehouse. The instructor was using array.splice(index, 1) instead of ..array.slice(1, index), ...array.slice(index+1).