The double curly braces: { } are used everywhere in react code. To pass props, to render state variables ... and so on. But it is a shame that I don't know what they are called. Somebody help.
Asked
Active
Viewed 2,606 times
2
faint-hearted-fool
- 339
- 4
- 14
-
Does this answer your question? [What do curly braces mean in JSX (React)?](https://stackoverflow.com/questions/43904825/what-do-curly-braces-mean-in-jsx-react) – Germa Vinsmoke Dec 02 '19 at 08:33
-
No, it doesn't say what they are technically called? Are they called just curly braces, don't they have a semantic name? – faint-hearted-fool Dec 02 '19 at 08:35
-
I think we should read FullStack React book for that. – Germa Vinsmoke Dec 02 '19 at 08:37
-
curly braces syntax. No special name so far(and it does not seem we really need that) – skyboyer Dec 02 '19 at 08:53
3 Answers
1
I think you're looking for the word 'interpolation'.
In Javascript, string interpolation is the evaluation of a string literal containing placeholders that are replaced with corresponding values during runtime.
curly braces - { } - can be two things:
- the definition of a Javascript object
- a way to "inject variables" in your HTML template
In react, since - { } - can be used to inject variables, double curly braces - {{ }} - are used to inject javascript objects within your JSX.
epap
- 39
- 4
0
Curly braces { } are special syntax in JSX. It is used to evaluate a JavaScript expression during compilation. A JavaScript expression can be a variable, function, an object, or any code that resolves into a value.
<h1 style={this.props.css}>Hello world</h1>
if you mean {{...}} is:
processing in a JavaScript way, so the outer braces are used exactly for this purpose.
But the style of the property accepts an object. And an object also needs another pair of curly braces to wrap it up. That's the purpose of the inner ones.
like this line:
<h1 style={ {color: 'red'} }>Hello world</h1>
Mehrnoosh
- 879
- 2
- 12
- 27
0
The outer braces are for signifying the content as JavaScript, and the inner for creating an object literal
Ksenia
- 171
- 4