props를 input으로 받고 React Element를 반환하는 함수.
함수 안에 함수를 사용할 수 있듯 Component 안에서 Component를 사용(조합)할 수 있고
함수를 독립된 스코프(js파일)에서 사용할 수 있듯 Component도 독립적으로 사용하거나 쪼갤 수 있다.
잘 설계된?? Component는 View에 렌더 될 로직과 데이터와 관련된 로직을 각각 분리하는 것이다.
Component는 props를 받아 사용한 후, 상태가 변경된 후 즉, 뷰에 렌더될 데이터? 요소?가 변경됬을 때 렌더된다.
기본적으로는 위와 같은 흐름인데 만약 Component들이 종속관계(부모, 자식)로 복잡하게 구성되어있다면
자식 Component에서는 변경되는 것이 없더라도 부모 Component가 렌더되면 같이 렌더된다.
즉 뷰에 표시할 데이터? 요소?가 변경된것이 없는데도 불필요하게 렌더되는것이다.
이를 방지하기 위해서는 shouldComponentUpdate() lifecycle 메서드를 사용해서 변경된 것이 있을때만 렌더될게 할 수 있고 또는 PureComponent를 extends하면 된다.