Какие этапы жизненного цикла в React приложении знаешь

Жизненный цикл React-компонента включает три основные фазы:

1. Монтирование (Mounting):

• constructor() – инициализация состояния
• render() – отрисовка компонента
• componentDidMount() – компонент вмонтирован в DOM

2. Обновление (Updating):

• shouldComponentUpdate() – определить нужно ли обновление
• render() – перерисовка компонента
• componentDidUpdate() – обновление завершено

3. Размонтирование (Unmounting):

• componentWillUnmount() – очистка перед удалением

Пример:

class Example extends React.Component {
  componentDidMount() {
    console.log('Компонент смонтирован');
  }
  
  componentDidUpdate() {
    console.log('Компонент обновился');
  }
  
  componentWillUnmount() {
    console.log('Компонент будет удалён');
  }
}

В функциональных компонентах используются хуки:

• useEffect(() => {}, []) – аналог componentDidMount
• useEffect(() => {}) – аналог componentDidUpdate
• useEffect(() => { return () => {} }) – аналог componentWillUnmount