Block is redundant.
20}
21
22// in jsx, under form, inside the larger div
23{24 pets.map((pet) => (25 <Pet name={pet.name} animal={pet.animal} breed={pet.breed} key={pet.id} />26 ));27}
Description
In JavaScript, prior to ES6, standalone code blocks delimited by curly braces do not create a new scope and have no use.
For example, these curly braces do nothing to foo
:
{
var foo = bar();
}
In ES6, code blocks may create a new scope if a block-level binding (let
and const
), a class declaration or a function declaration (in strict mode) are present. A block is not considered redundant in these cases.
Bad Practice
{}
if (foo) {
bar();
{
baz();
}
}
function bar() {
{
baz();
}
}
{
function foo() {}
}
{
aLabel: {
}
}
Recommended
while (foo) {
bar();
}
if (foo) {
if (bar) {
baz();
}
}
function bar() {
baz();
}
{
let x = 1;
}
{
const y = 1;
}
{
class Foo {}
}
aLabel: {}