질문드립니다 .

  switch (action.type) {
    case "INIT": {
      return action.data;
    }

    case "CREATE": {
      const newItem = {
        ...action.data,
      };
      newState = [newItem, ...state];
      break;
    }

    case "DELETE": {
      newState = state.filter((it) => it.id != action.targetId);
      break;
    }

    case "EDIT": {
      newState = state.map((id) =>
        it.id === action.data.id ? { ...action.data } : it
      );
      break;
    }
    default:
      return state;
  }
  return newState;

여기에 보면 ...으로 객체 깊은 복사? 하는거 같은데 만약에

CREATE 쪽  
const newItem = {
        ...action.data,
      };
newState = [newItem, ...state];

대신
 const newItem = {
        action.data,
      };
newState = [newItem, state];
으로 썼을떄 차이점

Edit쪽

  newState = state.map((id) =>
        it.id === action.data.id ? { ...action.data } : it

대신

  newState = state.map((id) =>
        it.id === action.data.id ? { action.data } : it
으로 썼을떄 차이점

    INIT 쪽
      return action.data;
    왜 이건 action.data를 바로 newState에 저장안시키고 리턴하는지 궁금합니다.

// 1번 버전
const newItem1 = {
    ...action.data,
  };
newState = [newItem, ...state];

// 2번 버전
const newItem2 = {
    action.data,
    //   ^^^ 오류 발생
};
newState = [newItem, state];

const name = "이정환";
const obj = {
  name,
};

console.log(obj);
// 출력 결과 : { name : "이정환" }