React03.What Hooks,Props,state?

seul3·2021년 11월 28일
0

1.Hooks


Hook는 뭐다? 후크 선장을 떠올릴 수 있는데 그렇다면 거의 정답이다!
바로 후크선장 손에 있는 갈고리가 바로 hook의 뜻이다.

react에서 Hook란 함수 component에서 React state와 생명주기 기능을 연동 할 수 있게 해주는 함수이다.

Hook은 class 안에서 동작하지 않는다.
대신 class없이도 react를 사용할 수 있게 해준다. react는 useState와 같은 내장 Hook을 몇가지 제공한다.


    Hook을 사용하는 이유는
  • 컴포넌트 사이에서 상태 로직을 재사용하기 어렵다.
  • 복잡한 컴포넌트들은 이해하기 어렵다.



2.props


props는 propeties 의 줄임이다.즉 Components의 속성값을 의미한다.어떠한 값을 컴포넌트에게 전달해줘야 할 때, pros 를 사용한다.(부모 Components 로 부터 전달 받은 데이터 객체) Components를 통해 UI를 재사용 가능한 조각으로 나누고 그것을 전달해주고 싶을 때 나눈다



3.state


State란? 단어 뜻 그대로 해석하자면 상태이다.
즉, component UI의 상태이다.State를 설정할 때는 화면에서 보여지듯이 useState를 import 해야한다.

ex) import React, {useState} from 'react';

const [color (상태값이 저장되는 변수) , setColor (상태값을 갱신하는 함수) ] =useState('black'); 인자로 넣어 호출하면 배열을 반환한다.

→ 즉,state를 담는 변수를 color로.color의 값을 갱신하는 함수를 setColor로 그리고 color 값을 black 정의한다.




profile
꾸준히 성장하는 개발자 입니다 😊

0개의 댓글