REACT different ways to declare a function?

someone knows why this pass the test , in https://learn.freecodecamp.org/front-end-libraries/react-and-redux/extract-state-logic-to-redux

// define ADD, addMessage(), messageReducer(), and store here:
const ADD = `ADD`;

function addMessage(message){
  return {
    type: ADD,
    message
  }
};

const messageReducer = (state = [], action) =>{
  switch(action.type){
    case ADD:
    return [...state, action.message]
    default:
    return state;
  }
}

const store = Redux.createStore(messageReducer);

and this not?

// define ADD, addMessage(), messageReducer(), and store here:
const ADD = `ADD`;

function addMessage(message){
  return {
    type: ADD,
    message
  }
};

const messageReducer = (state=[], action) => {
  return [...state,action.message]
}

const store = Redux.createStore(messageReducer);

The store should exist and have an initial state set to an empty array.

Dispatching addMessage against the store should immutably add a new message to the array of messages held in state.

The messageReducer should return the current state if called with any other actions.

// tests completed

i think it’s some related with the way the default value for state it’s declarated?..

The reducer is called first before any action is dispatched with the action.type as @@redux/INIT, in the first scenario since you’re not handling this case, the switch’s default statement will be returned, which is the state itself, an empty array.

In the second scenario you’re concatenating an empty array with action.message, which is undefined because @@redux/INIT doesn’t set it. You’re returning [undefined] instead of the expected [].

The messageReducer should return the current state if called with any other actions.

You’re concatenating undefined every time an action that is not ADD is dispatched.