컴포넌트의 속성 값을 지닌 props :
부모 컴포넌트가 자식 컴포넌트에게 주는 값입니다.
자식 컴포넌트에서는 props를 받을 수만 있고 받은 props는 수정 할 수 없습니다.
컴포넌트의 상태 값을 지닌 state :
컴포넌트 내부에 선언하며 내부에서 값을 수정 할 수있습니다.
클래스형 컴포넌트
render 함수가 꼭 필요
state 사용 가능
라이프사이클 기능 사용 가능
임의 메서드 정의 가능
함수형 컴포넌트 장점
클래스형 컴포넌트보다 선언하기 편함
클래스형 컴포넌트보다 메모리 자원도 덜 사용
클래스형 컴포넌트보다 배포 시 결과물의 파일크기도 더 작음 ( 성능과 기능면에서는 차이 없음)
함수형 컴포넌트 단점
state와 라이프사이클 API의 사용이 불가능 ( v16.8 업데이트 이후 Hooks 기능으로 해결됨)
props
props는 propertis를 줄인 표현입니다. 컴포넌트 속성을 설정할 때 사용하는 요소입니다.
props 값은 부모 컴포넌트에서 설정합니다.
state
state는 컴포넌트 내부에서 바뀔 수 있는 값을 의미합니다. props는 컴포넌트가 사용되는 과정에서 부모 컴포넌트가 설정하는 값이며, 컴포넌트 자신은 해당 props를 읽기 전용으로만 사용 할 수 있습니다. state를 바꾸려면 부모 컴포넌트에서 바꿔 줘야 합니다.
2가지 동류의 state가 있습니다. 하나는 클래스형 컴포넌트가 지니고 있는 state이고, 다른 하나는 함수형 컴포넌트에서 useState라는 함수를 통해 사용하는 state입니다.
728x90
300x250
