Недавно я начал проходить CS50M, гарвардский курс React Native по программированию мобильных приложений (примечание: курс устарел, но все лекции и материалы курса по-прежнему доступны). Во второй лекции инструктор представил концепцию императивного и декларативного программирования, и я был поражен, поскольку все, что я узнал о программировании и компьютерах в целом, сводится к тому, что программа или алгоритм представляет собой набор пошаговых инструкций. которые вы, по сути, загружаете в компьютер, чтобы получить желаемый результат. Из лекции я узнал, что эта парадигма известна как императивное программирование, но это, безусловно, НЕ единственный способ программирования.

Вот где декларативное программирование входит в чат. В то время как императивное программирование описывает шаг за шагом как вы хотите что-то сделать, декларативное программирование вместо этого описывает что вы хотите сделать. React является декларативным, позволяя нам писать то, что мы хотим, и позволяя библиотеке обрабатывать DOM.

В приведенном ниже примере Javascript декларативный код говорит, что нам нужен массив, который удваивает все значения в исходном массиве и возвращает нас туда, просто используя метод map(). Императивный код, с другой стороны, идет шаг за шагом, сначала создавая пустой массив, а затем создавая цикл, чтобы удвоить каждое значение и поместить его в массив.

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

В React мы создаем компоненты (по сути, это просто функции, возвращающие узел), и эти компоненты представляют конечное состояние пользовательского интерфейса, которого мы пытаемся достичь. Это отличается от пользовательского интерфейса, отображаемого с помощью Javascript, где мы определяем пошаговую логику того, как добиться желаемого результата на странице, используя селекторы запросов и обработчики событий. Я наткнулся на этот замечательный пример Алекса Сидоренко здесь, который показывает способ рендеринга пользовательского интерфейса на странице с помощью Javascript и компонента React.

Что лучше?

Как и в большинстве вещей в программировании (и в жизни 😅), в обоих случаях есть компромиссы. Главный недостаток, который я вижу в декларативном программировании, особенно на моем уровне опыта программирования, заключается в том, что, поскольку оно имеет более высокий уровень абстракции, оно требует более внимательного изучения, чтобы понять код, особенно если он написан кем-то другим. Что касается меня лично, в первом приведенном мной примере я в настоящее время гораздо больше привык читать/писать циклы for, чем использовать метод map(). Тем не менее, здесь меньше строк кода (что означает меньше места для ошибок), и я уверен, что когда я начну больше работать с React, я стану более уверенным в декларативном программировании и «абстрагируюсь от» любого дискомфорта или неопределенности.