Когда вы впервые встречаетесь с Redux, поначалу он часто кажется немного ошеломляющим. Однако, если вы хотите эффективно работать с Redux, вы должны понимать, как он работает и каковы его основные элементы. Состояние… Действия… Редукторы… Магазин… В сегодняшней статье я хотел бы познакомить вас с Redux, чтобы вы могли понять, как он работает.

Что такое Редукс?

Если вы совершенно не знакомы с Redux, вы можете сначала проверить документы Redux.

Redux — это контейнер с предсказуемым состоянием для приложений JavaScript.

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

Имейте в виду, что вам не нужно быть веб-разработчиком, чтобы использовать Redux-подобную архитектуру в своем приложении. Существует множество реализаций такой идеи для различных платформ и ReSwift — одна из них.

Архивы (состояние)

Если бы я спросил вас, как выглядит состояние в вашем приложении, то объяснить сразу было бы очень сложно. Некоторые значения хранятся в моделях представлений, есть несколько репозиториев, в которых также хранятся некоторые значения… О! И этот класс прямо здесь, который знает, какой пользователь в данный момент вошел в систему. Но что, если после такого вопроса мы могли бы сразу представить состояние наших приложений? Не проще ли было бы нам рассуждать о приложении, заказанном таким образом? В этом случае Redux предлагает нам решение.

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

Письма (Действия)

Итак… теперь у нас есть аккуратно структурированное состояние в наших архивах, все чисто и легко рассуждать. Но, как и следовало ожидать, существует высокая вероятность того, что наши пользователи захотят каким-то образом изменить это состояние (думаю, в этом нет ничего нового). Как мы справляемся с этим? Ну, мы не можем напрямую получить доступ к состоянию наших приложений и изменить то, что мы хотим. С чистыми архивами так не работают… Давайте представим, что я хотел бы изменить свой адрес. Я не могу просто зайти в мэрию и поиграть с их архивами. Мне нужно написать официальное «письмо».

Название: Джон Доу — Смена адреса

Здравствуйте, я только что переехал в другой дом. Мой текущий адрес: Art Street 10.

Не волнуйтесь, когда мы меняем состояние в нашем приложении, нам нужна только важная информация. Таким образом, это может выглядеть так:

Такое письмо может быть отправлено в тот момент, когда пользователь нажимает кнопку, а поля письма могут быть заполнены из формы, которую только что заполнил пользователь.

Бухгалтеры (создатели действий)

Однако иногда мы не можем подготовить такие письма сразу, так как у нас еще нет всех необходимых данных. Когда мне нужно выполнить http-запрос, я еще не знаю ответа. Для таких случаев нам приходится нанимать наших бухгалтеров. Они выполнят всю работу, а потом пришлют письмо от нашего имени. Например, получив ответ от сервера, они заполнят письмо необходимой информацией и отправят его нам.

Мэрия (Магазин)

После того, как ваше письмо будет готово, вы должны отправить его в мэрию. Там работает много людей, которые занимаются разными делами. Кто-то занимается вашей адресной информацией, кто-то заботится о регистрации вашего автомобиля и т. д. После того, как они обновят архивы с данными из вашего письма, они сообщат вам об этом, чтобы вы могли, например, обновить свой список дел и вычеркнуть «Изменить адрес». … Или обновите свой статус в Facebook. То же самое касается редукторов внутри приложения. Если будет создано новое состояние, все места, заинтересованные в этом обновлении, будут уведомлены.

Сотрудник мэрии (редакторы)

Как я уже сказал, в мэрии много людей, которые занимаются разными делами. Это редукторы в нашем приложении. Представим, что после того, как наше письмо получено, его отдают директору мэрии, который вручает его каждому работнику этой мэрии. Некоторые из них посмотрят на него и просто проигнорируют, так как увидят, что название им не знакомо. Но в какой-то момент найдется человек, который скажет: «О! Я несу ответственность за изменение адреса, я должен справиться с этим!». Имейте в виду, что единственный способ потребовать каких-либо изменений от людей, работающих в мэрии, — это предоставить им такие письма.

— это оператор спреда. Подробнее об этом можно прочитать здесь.

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

Резюме

Итак, это основные элементы архитектуры Redux.

Архивы — укажите в нашем приложении

Отправка писем — отправка действий с полезными данными, которые вызовут изменение состояния.

Бухгалтеры — создатели действий

City Hall — хранилище приложений, содержащее текущее состояние и редукторы, создающие новое состояние.

Работники мэрии — редукторы, которые знают, как создать новое состояние, используя текущее состояние и действие.

Я надеюсь, что это поможет некоторым новичкам понять, как работает редукс и каковы обязанности его элементов.