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 Introducing Props Setting and Using Props

Why is the Array iterated in const App(){} not in const Player(){} ?

My struggle atm is understanding why the array is iterated in the App Component, rather than the Player Component. If the Player component is responsible for displaying the names & scores, should it not also loop through the array?

1 Answer

Robert Manolis
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree
Robert Manolis
Treehouse Guest Teacher

Hey moises hernandez , the Player component represents a single player. So you wouldn't want to loop over all the players' data directly in the Player component. And all the players' data is in App.js. So to make good use of the concept of reusable components, in App.js, you loop over the player data, and pass info from each player to multiple instances of the singular reusable Player component. Hope that helps. :thumbsup:

Thanks Robert - yeah that makes sense. I hadn't realised that the Player component was only for a single player. I thought >1 players could be passed into it by looping the array inside it. Thanks for the explanation.