JavaScript Object.assign()

Object.assign(obj1, obj2)

Object.assign(obj1, obj2)는 obj2에 obj1을 복사해준다.

obj1 = { name: 'hyerim', age: 26 }
obj2 = { age: 20 }
Object.assign(obj1, obj2)

위의 Object.assign(obj1, obj2)는

{name: 'hyerim', age: 20}

이 된다. 이처럼, obj1에 obj2의 속성이 있을 경우 값이 바뀐다.

Object.assign({},obj1,obj2) 는 {}에 obj1, obj2를 복사해준다.

Object.assign은 얕은 복사이다.
반환되는 배열인 {}은 새로운 obj1, obj2와는 상관없는 새로운 주소값이지만,
obj1과 obj2에 참조 자료형이 있다면 그 참조자료형의 주소값은 같다.

Redux의 Reducer에서 Object.assign() 메소드를 사용해서 return할 것이다.

먼저 state 데이터는 다음과 같다.

const state = {
	'items' : [ { ... }, { ... }, { ... } ],
    'cartItems':[ { ... }, { ... }, { ... } ]
}

내가 작성한 Reducer은 다음과 같다.

    case ADD_TO_CART:
      let addInitialState = Object.assign({}, state, {
        cartItems: [...state.cartItems, action.payload]
      });
      return addInitialState;

새로운 객체인 addInitialState는 state를 복사했다.

case ADD_TO_CART:
  let addInitialState = {...state};
  addInitialState.cartItems = [
    ...state.cartItems, action.payload
  ];
  return addInitialState;

case ADD_TO_CART:
  let addInitialState = Object.assign({}, state, {
  cartItems: [...state.cartItems, action.payload]
  return addInitialState;
});

위의 두 ADD_TO_CART는 같다.

state와 addInitialState의 주소값만 비교하면 다음과 같다.

나는 위의 그림에서 1번지와 100번지의 items가 가리키는 주소값을 cartItems처럼 다르게 줘서 테스트 실패가 나왔다..