React Redux reducers

Question

I'm a newbie to react-redux and want to know the difference between the following two code snippets used within the reducer.

This is the first code snippet:

[types.GET_TAGS]: (state, {payload}) => {
    return {
        ...state,
        tagData:null
    };
},

And the second code snippet is this:

[types.GET_TAGS]: (state, { payload }) => ({
    ...state,
    tagData: null
}),

In the first code snippet return statement has been used... What's the difference?

Possibly this post will help you [Arrow functions and the use of parentheses () or {} or ({})](https://stackoverflow.com/questions/49425755/arrow-functions-and-the-use-of-parentheses-or-or/49425823#49425823) — Shubham Khatri, May 13 '20 at 06:16

score 1 · Answer 1 · answered May 13 '20 at 06:15

1

No difference, second is short notation, word return is omitted.

answered May 13 '20 at 06:15

Arturas Lapinskas

score 1 · Answer 2 · answered May 13 '20 at 06:17

There's nothing related to react-redux out here. The difference is in the notation of the arrow function.

The second code is a short notation of the first one.

For eg,

const a = () => {return 1};
a(); // will return 1

Similarly,

const b  = () => (1);
b(); // will return 1

score 1 · Accepted Answer · answered May 13 '20 at 06:18

There are no difference. It's a shortcut when you want to "return" something directly.

Example on a normal function:

const test = () => {
  return 'hello'
}

since we're not doing anything and we just want to return the 'hello' directly, we can do a shorter code which is:

const test = () => 'hello'

3 Answers3