useState
[state, setState] = useState(arg)
state: 현재 변수
setState: 해당 변수를 갱신해주는 함수
state 변수를 useState() Hook이 넘겨주는 인자값으로 초기화
해당 변수를 리렌더링할 때 기억, 가장 최근에 갱신된 값을 제공
setState 함수 호출을 통해 state 변수의 값을 갱신
기본적으로 상태(useState)로 만들면 안되는 것들
1. 기존 상태를 활용해서 만들 수 있는 것
2. props를 활용해서 만들 수 있는 것
구조분해할당
const countState = useState(0);
const count = countState[0];
const setCount = countState[1];
---------------------------------------
const [count, setCount] = useState(0);
map, filter
map, filter 메서드는 자신을 호출한 배열의 모든 요소를 순회하면서 인수로 전달받은 콜백 함수를 반복 호출,
콜백 함수를 호출하면서 3개(요소값, 인덱스, this)의 인수를 전달
map: 콜백 함수의 반환값들로 구성된 새로운 배열을 반환
filter: 콜백 함수의 반환값이 true인 요소로만 구성된 새로운 배열을 반환
props, children
children은 함수같은 것을 제외하고 거의 다 들어감
Component
컴포넌트는 기존의 html 태그의 인터페이스를 최대한 따라가는게 좋음
컴포넌트 사용 이유 -> 컴포넌트는 결국 함수다
함수를 만드는 이유
1. 특정 역할 수행하도록 함
2. 재사용되는 로직을 모듈화해서 불필요한 반복 작업을 줄임