react component: class vs function

react component에는 2가지 종류가 있다 - 클래스형, 함수형

• 아래 예시에서 보다시피 클래스형은 함수형보다 코드 길이가 더 길고 복잡
• 함수형은 클래스형보다 메모리 자원도 덜 차지한다고 함 (왜??)
• 그렇지만 함수형은 별도의 state나 lifecycle 정의를 할 수 없었기 때문에 간단한 용도로만 사용되었으나,
• 2019년 리액트 버젼16.8부터 추가된 hook으로 인해 함수형이 클래스형보다 많이 쓰이게 되었음
• 클래스형은 안쓴지 오래되서 이제 어떻게 쓰는지도 잘 모르겠음 (클래스형 https://devowen.com/298 참고하자)

 

class component

class Classcomp extends React.Component {
    state = {...};
    render(){
    	return(
        	<div className="containter>...</div>
        );
    }
}

function component

function FunctionComp(props){

	return (<div>...</div>);

}