How does spread work in JSX react?

Question

JavaScript

Having difficulty understanding how the spread operator works when we pass props to a react element, that's what I mean
we have

<Modal name={props.name} age={props.age} />
//Эквивалентно 
<Modal {...props} />

Is this feature specific to react? I'm missing some point, if in es6 spread expands the array into arguments, then here it expands the object, into the name = props.name construction.

Answer 1

Good afternoon!
"es6 spread spreads an array into arguments"
Object. An array is a special case of an object)
It is very difficult to explain in a simpler way than the words that you yourself wrote)
props is an object.
You pass it to the next component.
You can do it by name, as done in your example, you can do the destructuring first

const { name, age } = this.props;
<Modal age={age} name={name}>

Or you can pass all the properties of the props object at once and entirely)
That is, in fact, you simply pass the entire props object to the following component.
For example, if you write like this,
<Modal props={props}>then you will get these props in Modal, right?
And so <Modal {...props} />you just do the destructuring at the time of transmission (I hope this will be easier to understand)).