mezi
mezi

Reputation: 395

What is the technical name for the double curly braces { } in react?

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.

Upvotes: 3

Views: 3127

Answers (3)

Ksenia
Ksenia

Reputation: 251

The outer braces are for signifying the content as JavaScript, and the inner for creating an object literal

Upvotes: 0

epap
epap

Reputation: 39

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.

Upvotes: 1

Mehrnoosh
Mehrnoosh

Reputation: 899

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>

Upvotes: 0

Related Questions