Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.01.2021, 19:27
Новичок на форуме
Отправить личное сообщение для Konstantin81 Посмотреть профиль Найти все сообщения от Konstantin81
 
Регистрация: 19.01.2021
Сообщений: 8

Помогите пожалуйста!!! Задать поочередное выполнение инструкций при асинхронном коде
Не понимаю! Почему, при моем коде, нет остановки и ожидания выполнения await?
Подскажите, где я ошибаюсь?
Как сделать чтобы инструкции выполнялись поочередно?

async function different () {
	form.classList.add('_sending'); //Ставим анимацию при отправке
	let k = await post (result()); // Вызываем функцию отправки асоциативного масива на учебный сервер сервер
	formdata (); //Вызываем функцию создания объекта formdata
	//setTimeout(() => form.classList.remove('_sending'), 1000);
	form.classList.remove('_sending'); //Убираем анимацию при отправке
}
Изображения:
Тип файла: jpg 123-min.jpg (51.3 Кб, 4 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 19.01.2021, 21:28
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,692

Сообщение от Konstantin81
Не понимаю! Почему, при моем коде, нет остановки и ожидания выполнения await?
А как вы узнаете, что нет ожидания?
Функция different завершится сразу, но вернет Promise, который разрешится, когда завершится ожидание await и будут выполнены строки 4-6.

А почему
formdata (); //Вызываем функцию создания объекта formdata
стоит после обращения к серверу?
Ответить с цитированием
  #3 (permalink)  
Старый 19.01.2021, 22:57
Новичок на форуме
Отправить личное сообщение для Konstantin81 Посмотреть профиль Найти все сообщения от Konstantin81
 
Регистрация: 19.01.2021
Сообщений: 8

Цитата:
А как вы узнаете, что нет ожидания?
Первой инструкцией я добавляю анимацию
Второй обращаюсь к серверу,
Третей создаю formdata
Четвертой (последней) убираю анимацию.

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

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

Цитата:
А почему
formdata (); //Вызываем функцию создания объекта formdata
стоит после обращения к серверу?
Обращение к серверу и создание formdata между собой не связаны.
На сервер отправляется не форм дата.
Баг я заметил из за анимации.

Весь код:
https://codepen.io/konstantinopol/pen/MWjxmgW

Подскажите пожалуйста как инструкции поставить в очередь будь то Promise или async /await?


____________________________

Последний раз редактировалось Konstantin81, 19.01.2021 в 23:09.
Ответить с цитированием
  #4 (permalink)  
Старый 20.01.2021, 07:15
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,692

У вас вот какая ошибка.
function post (postArr) {
	fetch('https://jsonplaceholder.typicode.com/posts', {
		method: 'POST',
		headers: {'Content-type': 'application/json; charset=UTF-8'},
		body: JSON.stringify(postArr),
	})
		.then(first => first.json())
		.then(last => console.log(last));
}


А потом
let k = await post (result())


Функция post не асинхронная и возвращает не Promise.
await должен получить промис, что бы ждать. Если это не промис, то он превращается в сразу разрешенный промис, и поэтому ждать ничего не приходится. В вашем случае Promise.resolve(undefined).

Измените post, что бы она возвращала обещание, так
function post (postArr) {
	return fetch('https://jsonplaceholder.typicode.com/posts', {
		method: 'POST',
		headers: {'Content-type': 'application/json; charset=UTF-8'},
		body: JSON.stringify(postArr),
	})
	.then(first => first.json())
	.then(last => console.log(last));
}

Или так
async function post (postArr) {
	let first = await fetch('https://jsonplaceholder.typicode.com/posts', {
		method: 'POST',
		headers: {'Content-type': 'application/json; charset=UTF-8'},
		body: JSON.stringify(postArr),
	})
        let last = await first.json()
	console.log(last);
}
Ответить с цитированием
  #5 (permalink)  
Старый 20.01.2021, 11:15
Новичок на форуме
Отправить личное сообщение для Konstantin81 Посмотреть профиль Найти все сообщения от Konstantin81
 
Регистрация: 19.01.2021
Сообщений: 8

Цитата:
Функция post не асинхронная и возвращает не Promise.
await должен получить промис, что бы ждать. Если это не промис, то он превращается в сразу разрешенный промис, и поэтому ждать ничего не приходится. В вашем случае Promise.resolve(undefined).

Измените post, что бы она возвращала обещание, так
Огромное спасибо!!!
Благодаря Вашей помощи, код работает правильно!!!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите сделать выполнение jquery при загрузке страницы acidjazzz jQuery 3 30.03.2015 14:27