Search code examples
javascriptlodash

Nested objects become empty after deep cloning


I have an object that trying too deeply clone it before mutate in Redux but the nested objects become empty after deep cloning it with lodash or json

const initial = {
   infamy: {a: 1}
}

export const playerReducer = (state = initial, action) => {
  switch (action.type) {
    case SET_DATA:
      console.log("III", state);
      state = cloneDeep(state); //Why the neseted obj becomes empty?
      console.log("JJJ", state);
      break;
  }
};

Edit: looks look the issue was the condition i had for checking if the object was empty wasn't working so the empty data from the api was replacing the initial values but im wounding why the console.log was showing the post made mutation rather than pre made mutation

case SET_DATA:
      console.log("III", state);
      const nextState = cloneDeep(state);
      console.log("JJJ", nextState); //why the log shows the change in line 10 made? shouldn't it log the values then change happen?
      nextState.membershipId = action.payload.membershipId;
      nextState.membershipType = action.payload.membershipType;
      nextState.displayName = action.payload.displayName;
      console.log(action.payload.gambitStats);
      if (action.payload.gambitStats.allTime !== "undefined") { //the bug is here
        nextState.gambitStats = cloneDeep(action.payload.gambitStats);
        nextState.infamy = cloneDeep(action.payload.infamy);
      }
      return nextState;


Solution

  • You are checking for undefined as a string "undefined" instead of:

    if (action.payload.gambitStats.allTime !== undefined) { ...
    

    or just:

    if (!!action.payload.gambitStats.allTime)