useState?


 **useState** = 자주 바뀌는 값 사용 + state값은 최상위 컴포넌트에 선언되어야 한다.
 
  컴포넌트 만드는 법
  1. function 만들고
  return () 안에 html 담기
  <함수명></함수명> 쓰기

  ** 주의점 아무데나 함수를 선언해선 안되고 다른 함수 밖에서 만들어야 한다.

useState

State 왜 생겼는가? 변수의 업데이트를 바로바로 ui에 적용 시켜주고 싶어서
+ 기존 자바스크립트에 innerHtml 등 너무 복잡한 걸 단순화 하고 싶어서 

// 미션 버튼 누를 때 마다 1씩 증가 시키기
기본 문법 
let [a숫자, b숫자수정] = useState(0); //a는 변수 개념, b는 이를 업데이트하는 함수 개념

사용법 : 
<div>{a숫자}<div> // 화면 출력 : 0
<button onClick={더하기1}><button>

let 더하기1 = () => {
		b숫자수정(a숫자+1)
}

State는 비동기적이다. 변화가 일어나면 다시 위에서 부터 읽어서 html을 그려주게 되는데

let count = 0 , count = count + 1 ==> 계속 0으로 초기화 되서 실행 시마다 값이 1임
useState(0) => 값을 저장해서 계속해서 늘어남 

Array, Object 값 대입하기

<button onClick={()=>{

        let copy = **[...글제목];**
        copy[0] = '여자코트 추천';
        제목변경(copy);
                
}}>글 수정</button>

/* 빡대가리식 정리 */
state가 array/object이면 독립적 카피본을 만들어 수정해야함

+
 우선 1번으로 헷갈리는 점. 그런데 왜 화살표를 
이용해가지고 기존 state를 변경 하지 않는거지?

공식 문서 :  state로 저장 시 변경할 수 없도록 만들
어야 한다. 그래서 기존 배열을 복사 후 새 배열을
state로 두어 업데이트 해야 한다.