When to use Second Bracket and when not in javascript?

Question

    const index = users.findIndex((user) => user.id === id )
       console.log(index)

This Code Run perfectly. But this code showing wrong result

const index = users.findIndex((user) => {
        user.id === id
    })

    console.log(index)

Can anybody please explain me, Why using second bracket showing wrong result?

Answer 1

Because nothing is returned in the second example. By omitting the brackets, you are causing a return. Within the brackets you must use a return statement;

const index = users.findIndex((user) => user.id === id )

is the same as writing

const index = users.findIndex((user) => { return user.id === id; });

If there are brackets, then you must use a return statement. If there are no brackets then javascript implicitly returns the evaluated expression - user.id === id.

Answer 2

When using second brackets that is {}, you have to use return the statement.

If it's multi-line code then you have to use {} and return. If it's one line, you don't have to use that.

const index = users.findIndex((user) => {
       return user.id === id
    });

console.log(index)

You can refer the link below to see how arrow functions work, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

Answer 3

It's because when you open the brackets you need to state a return. For example, this -> (parameter) => something <- is equal to this -> (parameter) => {return something} <- The main difference between those two is that in the second case you can put more code and in the first case is only a return.

#1 Example

const sum = (a, b) => a + b //It will return the sum of a+b

#2 Example

const sum = (a, b) => {
  console.log(`adding ${a} + ${b}`);
  const result = a + b;
  return result;
}