React JS — компоненты высшего порядка

React JS — компоненты высшего порядка

От автора: компоненты высшего порядка React — это функции JavaScript, используемые для добавления дополнительных функциональных возможностей к существующему компоненту. Эти функции являются чистыми, что означает, что они получают данные и возвращают значения в соответствии с этими данными.

Если данные изменяются, функции более высокого порядка перезапускаются с различными вводимыми данными. Если мы хотим обновить возвращаемый компонент, нам не нужно менять компоненты более высокого порядка. Все, что нам нужно сделать, это изменить данные, которые использует наша функция.

Компонент более высокого порядка (HOC) обертывает «нормальные» компоненты и обеспечивает дополнительный ввод данных. Это фактически функция, которая принимает один компонент и возвращает другой компонент, который оборачивает исходный.

Давайте рассмотрим простой пример, чтобы понять, как работает эта концепция. MyHOC — это функция более высокого порядка, которая используется только для передачи данных в MyComponent. Эта функция использует MyComponent, улучшает его с помощью newData и возвращает улучшенный компонент, который будет отображаться на экране.

Если мы запустим приложение, мы увидим, что данные передаются в MyComponent.

Примечание. Компоненты более высокого порядка могут использоваться для различных функций. Эти чистые функции являются сутью функционального программирования. Как только вы привыкнете к этому, вы заметите, как ваше приложение становится легче поддерживать и обновлять.

Источник: https://www.tutorialspoint.com/

Редакция: Команда webformyself.

Курс по React JS Material UI

Прямо сейчас посмотрите курс по React JS Material UI

Смотреть курс

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Я не робот.

Spam Protection by WP-SpamFree