modifier function은 인자를 받는데 어떤 값을 넣어주던 그 값으로 data 를 업데이트 하고 리랜더링을 해준다.
modifier가 인자로 어떤이름으로도 쓸수 있지만 다 state를 의미한다. modifier라는 함수 안에서 또다른 함수를 넣어줄때 인자로 들어가는 것이 state임을 기억해두면 좋다. modifier( (current) => current + 1)) 와 같이 말이다.
current는 modifier의 state, 아래 코드에서는 counter를 의미할 것이다.
modifier()
안에 넣어준 인자가
1. data 값을 업데이트 하고
2.다시 리랜더링 해주는 것과 동일한 역할을 수행한다.
const 는 재할당 불가
ex.
const foo = 1;
foo = 99; // 원시값 foo를 재할당하므로 불가능
const zoo = 1;
zoo +1; //원시값이 변경되지 않았으므로 가능
추가로 const로 선언된 객체에서
const person = {name : "nico"};
person.name = "nicoo"; // 가능
//object 를 const 로 지정할 경우 주소가 참조되는데 이때, 주소가 바뀌는 로직이 없다면 해당 객체 내의 값을 변경해 주면서 사용 가능
그리고 재할당이 필요한 변수가 아니라면 const를 사용하는 것이
안전하다고 합니다. const는 항상 같은 객체를 가리키고 있기 때문이라고 합니다.
참고 : https://hyunseob.github.io/2016/11/21/misunderstanding-about-const/
일반적으로 State를 사용할때
앞의 data는 원하는 이름 예를 들면 지금처럼 counter
뒤의 modifier는 앞에 set을 붙혀서 setCounter 이런 식으로 적어준다.
setCounter(counter+1) 이라고 적어줘도 괜찮은 이유는 setCounter 함수의 인자로 그냥 대체해버려서 그런듯.
배열을 const로 선언해 주면 주소값을 참조하게 된다. 배열안의 원소이기에 주소값으로 들어가 수정을 해주는 것이라 괜찮은 것 같다. useState 안에서 사용하는 우리의 데이터를 저장하는 state 도 배열의 한 원소임으로
내부적으로 저런 처리를 해줘서 동작하는게 아닌가 그렇게 이해해본다.
counter ++ 은 안되는데
counter ++ 은 counter = counter + 1 으로 constant value를 재할당해주기 때문이다.