Отправка GET запросов через AJAX в JavaScript

Давайте теперь научимся передавать данные на сервер в AJAX запросе. Сервер что-то будет делать с этими данными и отправлять нам обратно результат.

Наш тестовый сервер будет обрабатывать данные, отправленные на адрес /handler/:

button.addEventListener('click', function() {
	let promise = fetch('/handler/');
});

Для начала давайте отправим GET запрос:

button.addEventListener('click', function() {
	let promise = fetch('/handler/?num=3');
});

Давайте получим отправленные данные на стороне сервера:

export default {
	'/handler/': function({get}) {
		console.log(get.num); // выведет 3
	}
}

Давайте что-нибудь сделаем с этими данными и отправим их обратно:

export default {
	'/handler/': function({get}) {
		return get.num ** 2;
	}
}

На стороне клиента получим результат и выведем его куда-нибудь:

button.addEventListener('click', function() {
	fetch('/handler/?num=3').then(
		response => {
			return response.text();
		}
	).then(
		text => {
			console.log(text);
		}
	);
});

На клиенте дан див и кнопка. По нажатию на кнопку отправьте на сервер два числа. Пусть сервер найдет сумму переданных чисел. Результат запишите в див.

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