useState

useState가 저장하고 있는 내부값(컴포넌트에 연결 되어있는 state)은 함수 내부가 아니라 메모리에 저장

 

 const [cards, setCard] = useState('남자 코트 추천');

State는 변수 대신쓰는 데이터 저장공간(cards)

useState를 사용해 초기화 시켜줘야 함.(문자, 숫자, array, object 다 저장 가능)

배열은 이런식으로 state에 사용됨

여기서 화면에 데이터를 뿌려주는 경우가 많다(객체, 배열).

 

객체의 경우 이를 바로 화면에 표현할 수 없다.

객체의 경우 이런식으로 표현가능

배열안에 들어있는 객체를 다 출력하려면?

1. 배열을 순회한다.

2. 순회하는 맵의 인자를 각각 새로만든 컴포넌트에 넣는다.

3. 새로 만든 컴포넌트에서 props의 인자로 접근하여 출력한다

1,2,3까지의 과정

4. props의 여러 인자가 올시 destructuring을 사용하면 간편

 

이런느낌으로 destructuring