state?

일반 자바스크립트 객체

함수 내에 선언된 변수처럼 컴포넌트 안에서 관리함

JS 비구조화 할당

import React, { useState } from 'react';

let [name, age] = ['zzang', 22];

const arr = useState('');
arr[0] -> name
arr[1] -> setName

const [name, setName] = useState('');

일반 변수와 차이점

state는 변수와 달리 변동사항이 생기면 리액트가 자동으로 HTML을 리랜더링해줌

화면에 표시되고 자주 바뀔 부분을 state로 설정하는 것이 좋다.

변경되지 않을 부분은 일반 변수로 저장하는 것을 권장한다.

출처 :

중요한 데이터는 변수말고 state에 담습니다

Hook?

함수 컴포넌트에서 state와 생명주기 기능을 연동할 수 있게 해주는 JS 함수

클래스 컴포넌트를 사용할 때는 constructor 안에서 this.state 내부에 state 변수를 선언함