Reducers의 규칙

1. 값을 반환해야 한다. undefined를 반환하게 되면 오류가 발생한다.
2. 이전 state와 액션만 사용하여 프로그램의 state 또는 데이터를 생성한다.
3. 순수 함수(Pure function)이어야 한다. 즉, 리듀서가 바로 API를 호출하거나 DOM을 조작하는 작업을 수행하면 안된다.
4. 입력된 'state' 인수를 뮤테이트(mutate)하지 않아야 한다. 뮤테이트하지 않은 결과를 반환하는 것이 좋다.

mutate란 무엇일까?

const colors = ["red", "green"]
undefined
colors.push("purple")
3
colors
(3) ['red', 'green', 'purple']
colors.pop()
'purple'
colors
(2) ['red', 'green']

colors[0] = "Pink"
'Pink'
colors
(2) ['Pink', 'green']

const profile = {name: 'Alex'}
undefined
profile.name = 'Sam'
'Sam'
profile
{name: 'Sam'}
profile.age = 30
30
profile
{name: 'Sam', age: 30}

위에 push와 pop 예시들처럼 array 자체의 컨텐트가 바뀌게 되는게 자바스크립트에서 mutate되는거라고 한다.

근데 아래의 예시처럼

const name = 'Sam'
undefined
name[0]
'S'
name[0] = 'X'
'X'
name
'Sam'

String이랑 number는 immutable하다고 한다.

오호 그리고 어제 자바스크립트 복습할때 배웠던게
지금 또 나왔는데

const numbers = [1,2,3]
undefined
1 === 1
true
"hi" === "hi"
true
1 != 2
true
1 != 1
false
numbers === numbers
true

이렇게 비교할때 array와 object는 같은지를 비교하는게
숫자랑 string과는 조금 다르다.
안에 있는게 똑같은걸 보는게 아니라 메모리에서 저장되는 address가 같은지를 본다.
그래서 분명히 number안에
저장되어있는 array가ㅏ 1,2,3 맞는데 이렇게 하면
false가 나온다.

numbers === [1,2,3]
false

왜냐면 메모리에 저장되어있는 address가 다르기 때문이다.

+) 영어버전

Rules of Reducers

-Must return any values besides 'undefined'
-Produces 'state', or data to be used inside of your app using only previous state and the action
-Must not return reach 'out of itself' to decide wht value to return(reducers are pure) 리듀서는 state + action만 return해야함. 리듀서에서 바로 api 부르거나 dom으로 조작하려고 하면 안됨
-Must not mutate its input 'state' argument(misleading)
you can mutate actually.. but there is one case that can be a trouble. 그래도 mutate하지 말기 ~