#React JS-4 React LifeCycle

React LifeCycle

1. Mounting

React 컴포넌트 객체가 DOM에 실제로 삽입되기 전까지의 과정(Mounting)

 

1) contructor()

2) compoentWillMount()

3) render()

4) compoentDidMount()

 

기본적으로 컴포넌트가 모두 구성된 직후인 componentDidMount() 함수에서 API 호출을 수행하면 효과적

 

2.Updating

기본적으로 화면에 특정한 객체를 렌더링하기 위해서는 props 혹은 stste를 사용

props와 state는 이러한 과정이 서로 다르지만 대략적으로 다음과 같은 순서로 수행

 

1) shouldCompoientUpdate()

2) componentWillUpdate()

3) render()

4) componentDidUpdae()

기본적으로 컴포넌트의 데이터와 하면에 출력된 내용이 다를 때 shouldComponentUpdate() 함수가 동작한다. 이 함수는 기본적으로 true 값을 반환한다.

또한 화면에 출력되는 화면 구성을 변경하고자 할 때는 componentDIdUpdate()를 많이 사용.

 

근데 이함수를 직접적으로 우리가 다룰 일은 많지 않다.

 

3. Unmounting

 

1) componentWillUnmount() 

componentWillUnmount()를 통해서 컴포넌트의 동작을 위해 사용되었던 메소드들의 리소스를 제거함으로서 app의 성능 향상을 위해 사용되는 경우가 많다.