trying to understand line 6 of List.js [if (this.props.children instanceof Array)]-----------Section 11/13
The image i’ve attached is the closest thing i can get of an explanation to why the if statement evaluates to true so that the " 's " gets attached to pluralize if needed.
Array is not in the list for instanceof but im guessing its one of the words used to evaluate if this.props.children is an Array
When in the code they make the JSX li elements, they don’t use the “key” attribute, yet in one of the previous lessons they suggested to do so to make sure that when rendering, the code doesn’t get confused on which items it already rendered.
Why aren’t there those keys?
Keys are only needed if the items on the list are being updated. For example, checking off a grocery item would refresh the list and only populate the remaining items. The keys ensure the list will repopulate in the same order.
Just wanted to say thank you to the content creator (+= ‘s’) of this section, for your general hilarity, and for knowing Harvey Sid Fisher! What?? You’ve made my day. Props to you!
I think too its important to remember that even though React is a hodgepodge of HTML and JS in this instance we are dealing with your standard html list elements… keys are a property of JS objects which in this case we are not dealing with.
Though I’m sure you all have since moved on since it was a while ago.
The Bonus question pluralization is the INSTANCE OF is also a good debug tool if your wanting to check side effects in your code. Like is what is being returned to me an Object Array ?? what is it???.. and because its close to Halloween: WHAT’S IN THE BOX??? that’s sort of what Instanceof does.
The return value is True or False so that’s part of the answer probably… but how it evaluates List instance ??? It would have to evaluate this.props children at two or more children to evaluate to an array worth pluralizing IDK I mean i’m glad there’s some part of an enumeration function going on in the background that I don’t have to write logic for so… Win??
I D K what this says about me but this has been bothering me all yesterday and a portion of my morning. I leaned in and did a quick read of the Cheat Sheet and this is some of something:
so everything between the tags will get returned … okay interesting…
And then I re-read the exercise’s prompts and
…
So as much as I want it to be the snazzy instanceof by itself: IT’S BOTH.
So all you need to do is then pair how it evaluates the children with instanceof so when its an array add and ‘S’ and when its not an array: No S needed. I mean super neat they built it that way because when you pair it with logic you can add Sweet Sweet Ss (sp?!) on things.
Hello.
I think that in the exercise before the instructions the platform clarifies about this topic:
If a component has more than one child between its JSX tags, then this.props.children will return those children in an array. However, if a component has only one child, then this.props.children will return the single child, not wrapped in an array.
Hello.
I think that in the exercise before the instructions the platform clarifies about this topic:
If a component has more than one child between its JSX tags, then this.props.children will return those children in an array. However, if a component has only one child, then this.props.children will return the single child, not wrapped in an array.
If you look at List.js file, you will see the following in the List component:
let titleText = `Favorite ${this.props.type}`;
The List component expects to be passed a property named type.
The parent component class App provides the value of this property:
<List type='Living Musican'>
Suppose, in the List component we expected a prop named abc i.e. it expected to use this.props.abc, then the parent class would have the responsibility to provide a value for this property at the time of rendering the child component.
) below!
) to up-vote the contribution!
that’s sort of what Instanceof does.
…
