redux reducer

Reducer

reducer은 위에서 말했듯이 dispatch열차를 타고온 action의 type을 확인해서 그에 맞는 동작을 하는 곳입니다. 동작을 하기 때문에 function으로 작성이 됩니다.

 

 

import { REMOVE_FROM_CART, ADD_TO_CART, SET_QUANTITY } from '../actions/index'

import { initialState } from './initialState'

 

const itemReducer = (state = initialState, action) => {

switch (action.type) {

case ADD_TO_CART:

//TODO

 

return Object.assign({}, state, {

cartItems: [...state.cartItems, action.payload],

})

case REMOVE_FROM_CART:

// 삭제 !== 해당 상품 빼고 조회하기

return Object.assign({}, state, {

cartItems: state.cartItems.filter(

el => el.itemId !== action.payload.itemId

),

})

 

break

case SET_QUANTITY: // 수량 추가? 세는거? 번호..

let idx = state.cartItems.findIndex(

el => el.itemId === action.payload.itemId

)

// 입력한 상품이랑 있는 상품이 같으면 idx에 대입.

state.cartItems[idx].quantity = action.payload.quantity

return Object.assign({}, state, {

cartItems: state.cartItems,

})

//TODO

 

break

default:

return state

}

}

 

export default itemReducer

 

 

Object.assign() 메서드는 출처 객체들의 모든 열거 가능한 자체 속성을 복사해 대상 객체에 붙여넣습니다. 그 후 대상 객체를 반환합니다.

 

Object.assign(target, ...sources)\

 

매개변수

target

목표 객체. 출처 객체의 속성을 복사해 반영한 후 반환할 객체입니다.

sources

출처 객체. 목표 객체에 반영하고자 하는 속성들을 갖고 있는 객체들입니다.

 

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

객체 복제

const obj = { a: 1 };
const copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }