Идея внедрения Hooks и других функций, таких как React.memo и React.lazy, заключается в том, чтобы помочь сократить объем кода, который нужно писать, а также объединить похожие действия вместе.
В документах упоминается несколько действительно веских причин использовать крючки вместо классов
Трудно повторно использовать логику с отслеживанием состояния между компонентами Как правило, когда вы используете HOC или renderProps, вы должны реструктурировать свое приложение с несколькими иерархиями, когда вы пытаетесь увидеть его в DevTools, хуки избегают таких сценариев и помогают в более ясном код
Сложные компоненты становятся трудными для понимания Часто с классами Взаимосвязанный код часто заканчивается вместе, или связанный код имеет тенденцию разделяться, становится все труднее поддерживать. Примером такого случая являются слушатели событий, где вы добавляете слушателей в componentDidMount и удаляете их в componentWillUnmount. Крючки позволяют объединить эти два
Классы путают как людей, так и машины С классами вам нужно понимать привязку и контекст, в котором вызываются функции, что часто становится путаницей.
функциональные компоненты с крючками не могут помочь в качестве класса
компоненты делает. Они не могут пропустить повторные рендеры, поскольку у них нет
shouldComponentUpdate реализовано.
Функциональный компонент можно запоминать аналогично React.PureComponent с классами, используя React.memo, и вы можете передать функцию компаратора в качестве второго аргумента React.memo, который позволяет вам реализовать собственный компаратор
Идея состоит в том, чтобы иметь возможность писать код, который вы можете написать, используя компонент класса React, используя функциональный компонент с помощью Hooks и других утилит. Хуки могут охватывать все варианты использования классов, обеспечивая большую гибкость при извлечении, тестировании и повторном использовании кода.
Поскольку ловушки еще не полностью поставлены, рекомендуется не использовать ловушки для критических компонентов и начинать с относительно небольших компонентов, и да, вы можете полностью заменить классы функциональными компонентами
Тем не менее, одна из причин, по которой вы все равно должны использовать компоненты Class над функциональными компонентами с перехватчиками, пока Suspense не выйдет для извлечения данных. Выборка данных с помощью ловушек useEffect не так интуитивна, как с методами жизненного цикла.
Также @DanAbramov в одном из своих твитов упомянул, что крючки предназначены для работы с Suspense и до тех пор, пока не будет приостановлено, лучше использовать Class