Ajax объясняется обновлением вашего символа видеоигры

Автор оригинала: FreeCodeCamp Community Member.

Кевином Кононенко

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

AJAX (короткий для асинхронного JavaScript и XML) может быть довольно сложным для новых веб-разработчиков для понимания. Без чувства того, как браузер взаимодействует с сервером, AJAX может показаться, как будто он работает от Magic.

Но не теряй надежду. Подумайте о AJAX как похоже на то, как вы обновляете свой персонаж в ролевых играх, таких как Pokemon или Final Fantasy.

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

Этот пост будет сосредоточен на том способах взаимодействия с сервером, используя два наиболее распространенных метода AJAX: Post и Get.

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

Посты запросов похожи на добавление предметов к вашему инвентарю

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

Допустим, вам нужно новое оружие, чтобы взять большие вызовы в вашей игре. Вы ищете каждый элемент, пока вы наконец не найдете его – новый меч! Это оружие легче, быстрее и сильнее клуба, с которой вы начали игру.

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

1. Тип оборудования, который вы добавляете (меч)
2. Вес (скажем 20)
3. Ущерб на удар (скажем 10)
4. Это тип металла (скажем, сталь)
5. Способность защиты/блокировки (скажем 5)

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

Обратите внимание, что мы будем использовать jQuery – один из самых популярных библиотек JavaScript – упростить процесс создания этих этих запросов.

Ваш почтовый запрос будет иметь 4 части:

1. Делаете ли вы $ .post или $ .get.get.
2. маршрут. Маршрут – это повторяющийся шаблон, который распознает ваш задний план. В этом случае добавляя в значительной степени любое оборудование, как меч или щит или нагрудник, будет следовать подобным образом, потому что все они могут быть оснащены своим персонажем. Вы бы использовали другой маршрут, если вы собирали ресурсы, такие как металлическая руда, дерево или монета. Хотя эти должны быть сохранены, они не будут «оснащены» для вашего персонажа – просто сохранены в вашем инвентаре. Эти маршруты могут быть «/сборщиками» или «/коллектор».
3. Данные, которые на самом деле будут храниться. Здесь вы храните атрибуты оборудования: тип оборудования, повреждения, веса и т. Д., Как мы изложили выше. Мы можем использовать объект для этого.
4. Обратный вызов. Это позволяет вам указать, что должно произойти непосредственно после завершения поста. Вы можете обогнать меча и бросить клуб.

Вот законченный код, который вы использовали для хранения меча:

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

Реляционные базы данных немного за пределами объема этого руководства, но если вы хотите настроить базу данных для хранения этого, вы можете создать таблицу «оборудования», которая хранит все оборудование для каждого пользователя. Это будет выглядеть что-то подобное:

Когда вы создаете веб-приложение, вы можете использовать запрос на пост:

1. Создать новый пользователь
2. Хранить запись, созданную пользователем
3. Храните комментарий, созданный пользователем

Получить запрос как нерестовые враги

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

Допустим, ты топал этот бедный Диглетт. Это не изменит тот факт, что есть покемон, который называется Diglett, который существует на вашем сервере. Вы все равно сможете столкнуться с Dogletts в будущем.

Допустим, вы бегаете в темнице, и вы сталкиваетесь с самым страшным врагом всех времен: скелет (не совсем).

Нам нужно написать код, чтобы этот случайный скелет будет иметь определенные черты. Вот что могут выглядеть некоторые его атрибуты:

1. Тип: Скелет
2. Атака: 10.
3. Мобильность: 5.
4. Защита: 2.
5. Оборудование: шлем, булава

Вы можете структурировать вашу точку зрения:

1. $ .get или $ .post.
2. Маршрут. Получить маршрут означает, что вы будете получать данные с сервера в определенный пакет. Похоже на пост, вы хотите, чтобы этот маршрут был обобщенным, поэтому он захватывает любой тип взаимодействия с врагом.
3. Параметры. Детали на этом специфическом враге.
4. Обратный вызов. Что происходит, когда вы занимаетесь этим врагом в бою?

Когда вы изначально построили игру, вы определили, как будет выглядеть скелет, как он будет двигаться. Теперь вам нужно динамически создавать скелет, который столкнется с вашим персонажем. Запрос Get позволит вам вызвать скелет с конкретными чертами, которые продиктованы вашими параметрами.

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

Теперь скажем, что вы строите сайт электронной коммерции, где вы продаете картонные коробки. Пользователь может захотеть отсортировать свой выбор на основе:

1. Толщина коробки
2. Размер коробки
3. Кол-во в наличии

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

В итоге…

• Ваша база данных заполнена компонентами, которые можно вызвать и представить пользователю. Некоторые были инициализированы приложением, а некоторые добавлены пользователем.
• Запрос на почту позволяет добавлять компоненты в базу данных.
• Запрос на получение позволяет динамически вызывать как встроенные, так и ранее добавленные компоненты. Они могут быть объединены по-разному, основанные на параметрах запроса Get.

Если вам понравился этот пост, вы также можете наслаждаться моим Другие объяснения сложных темов CSS и JavaScript, таких как позиционирование, модель-контроллер, а также обратные вызовы.

И если вы думаете, что это может помочь другим людям в той же позиции, что и вы, дайте ему «сердце»!