Недавно мне пришлось работать над групповым проектом для учебного курса по разработке программного обеспечения Flatiron School, и мы столкнулись с проблемой, которую я решил с помощью функции. Цель здесь заключалась в циклическом просмотре ресурсов в массиве JSON, который извлекается через запрос на выборку, чтобы заполнить список на странице html по запросу. Для перемещения по данным массива используется кнопка «следующий/предыдущий». Одна из первых проблем, с которой мы столкнулись, заключалась в том, как ограничить попытки перебора данных при достижении конца или начала массива. Для этого мы использовали запрос на выборку с сервера JSON и вызвали функцию для передачи этого массива, как показано здесь:
При вызове функции в запросе на выборку данные из этого массива передаются в эту функцию. Оттуда я использовал серию операторов If, чтобы сравнить, какова текущая позиция запроса кнопки относительно позиции в массиве. Это использовалось в качестве ограничителя запроса кнопки, чтобы не возникала ошибка. Это код для всей этой функции:
Еще одна проблема, с которой мы столкнулись с этой функцией, касалась области действия. Первоначально у нас была глобальная настройка функции fetchProfile вместе с переменной «item», но когда я вызывал функцию из операторов IF, возникали ошибки со значением «item», которые не позволяли мне получить нужные данные. Как вы можете видеть выше, все, что мне нужно было сделать, чтобы решить эту проблему, — это переместить функцию fetchProfile в функцию moveThroughProfiles. Я мог представить, что проблема, связанная с порядком в коде, обрабатывалась вместе с проблемами области. Таким образом, создание всего в той же области, что и основная функция, решило эту проблему. Я уверен, что есть еще несколько способов сделать это, но в этом случае я знал, что то, что мы сделали здесь, сработает.
Итак, мы получили циклическую функцию, позволяющую перемещаться по массиву и заполнять нужные данные, а затем возникла другая проблема. Каждый раз, когда мы нажимали кнопку «Далее» или «Предыдущая», добавлялась новая карта, но старая оставалась на месте. Если бы вы продолжали нажимать эти кнопки, это просто до бесконечности добавляло бы больше карт в список, когда мы хотели, чтобы отображалась только одна за раз. Чтобы решить эту проблему, мы сделали следующее:
Это удобная функция, которая позволила мне очистить список с html-страницы, а также передать необходимые данные в следующую функцию, которую мы вызываем для фактического отображения профиля. Это решило проблему под рукой отлично.
Благодаря этим функциям программа работала так, как предполагалось. Если вы хотите увидеть полную программу, вот ссылка на github: https://github.com/joefeet11/Rinder-Phase-1-Project.
Одна вещь, которую можно было бы значительно улучшить, — это стиль html-страницы. Мы потратили на это меньше времени, чем должны были, но функциональность была важнее всего.
В ближайшие недели я опубликую еще несколько блогов, так что следите за обновлениями и подписывайтесь.
