(React)리액트 : 함수형 컴포넌트 VS 클래스형 컴포넌트

---

(React)리액트 : 함수형 컴포넌트와 클래스형 컴포넌트에 대해서

---

*이 포스팅은 "리액트를 다루는 기술"을 복습하는겸 정리한 포스팅입니다.

현재 리액트가 업데이트 됐거나 수정된 사항, 삭제된 사항이 있다면 꼭 말씀주시면 감사하겠습니다 :)

 

함수형 컴포넌스 VS 클래스형 컴포넌스

	함수형 컴포넌트	클래스형 컴포넌트
state	X	O
라이프사이클	X	O
Hook	O	X
장점	1. 클래스형 컴포넌트보다 선언하기 편함 2. 메모리 자원이 클래스형 컴포넌트보다 덜 사용함. 3. 파일크기가 클래스형보다 더 작음	...
간편한 코드 생성 단축키	에디터에서 rsc 입력 후, Tab누르기	에디터에서 rcc 입력 후, Tab누르기
코드 형식	import React from 'react'; const TodosContainer = () => {   return (     <div>     </div> ); }; export default TodosContainer;	import React, { Component } from 'react'; class TodosContainer extends Component {   render() {     return (       <div>       </div> ); } } export default TodosContainer;

최근 클래스형 컴포넌트보다는 함수형 컴포넌트를 많이 쓴다고 합니다. 

하지만, 클래스형 컴포넌트가 사라지는것은 아니므로 클래스형 컴포넌트도 알아두어야 됩니다.