• If the function body consists of a single statement returning an expression without side effects, omit the braces and use the implicit return. Otherwise, keep the braces and use a return statement. eslint: , arrow-body-style

  // good
  [1, 2, 3].map(number => A string containing the ${number}.);

  // good
  [1, 2, 3].map((number) => {
  const nextNumber = number + 1;
  return A string containing the ${nextNumber}.;
  });

  // good
  [1, 2, 3].map((number, index) => ({

  [index]: number,
}));
// No implicit return with side effects
function foo(callback) {
  const val = callback();
  if (val === true) {
    // Do something if callback returns true
  }
}
let bool = false;
// bad
// good
foo(() => {
});
```

• In case the expression spans over multiple lines, wrap it in parentheses for better readability.

• 8.4 If your function takes a single argument and doesn’t use braces, omit the parentheses. Otherwise, always include parentheses around arguments for clarity and consistency. Note: it is also acceptable to always use parentheses, in which case use the for eslint. eslint: arrow-parens

  // bad
  [1, 2, 3].map((x) => x * x);
  // good
  [1, 2, 3].map(x => x * x);
  // good
  [1, 2, 3].map(number => (
    `A long string with the ${number}. It’s so long that we don’t want it to take up space on the .map line!`
  ));
  // bad
  [1, 2, 3].map(x => {
    const y = x + 1;
    return x * y;
  // good
  [1, 2, 3].map((x) => {
    const y = x + 1;
    return x * y;
  });

• Avoid confusing arrow function syntax (=>) with comparison operators (<=, >=). eslint: no-confusing-arrow

• 8.6 Enforce the location of arrow function bodies with implicit returns. eslint:

  // bad
  (foo) =>
    bar;
  (foo) =>
    (bar);
  // good
  (foo) => bar;
  (foo) => (bar);
  (foo) => (
  )