React의 생명 주기(라이프 사이클)

React의 생명 주기란?!

• 컴포넌트 기반 라이브러리, React.
• 각 컴포넌트에는 생명 주기(라이프 사이클)가 존재.
• 이 생명 주기는 생성 ⇒ 업데이트 ⇒ 제거 단계로 크게 나눌 수 있다.

생명주기 함수는 클래스 컴포넌트에서만 사용 가능하다.
함수형 컴포넌트에서는 Hooks로 대체 되었다.

---

생성 단계, Mounting

• 컴포넌트가 DOM에 최초로 삽입될 때 실행.
• 최초의 state 정의.
• 이벤트 등록과 비동기 작업 처리.

실행되는 메서드

• constructor
• getDerivedStateFromProps
• render
• componentDidMount

---

업데이트 단계, Updating

• props나 state가 변경될 때 실행.
• 컴포넌트 리렌더링을 위한 UI 변경, state 변경 처리.

실행되는 메서드

• getDerivedStateFromProps
• shouldComponentUpdate
• render
• getSnapshotBeforeUpdate
• componentDidUpdate

---

제거 단계, UnMounting

• 컴포넌트가 DOM에서 제거될 때 실행.
• 등록했던 이벤트 해제.

실행되는 메서드

• componentWillUnmount

---

✨ 출처

blog, [React/기술면접] 생명 주기 (Life Cycle)

---