Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Я не могу понять async и await. Объясните на моём примере (https://javascript.ru/forum/misc/79428-ya-ne-mogu-ponyat-async-i-await-obyasnite-na-mojom-primere.html)

CryNet 07.02.2020 12:15

Я не могу понять async и await. Объясните на моём примере
 
Песочница: https://jsfiddle.net/bqgy0p4v/

Есть селект. Его обрабатывает библиотека Choices.js. Я хочу скопировать в переменную этот селект до того, как его обработает библиотека (если селект обработала библиотека - она навешивает класс, убирает лишние option и скрывает select), но попросту не успеваю, а async и await мне в этом не может помочь. Видимо, я что-то делаю неправильно. Подскажите что не так.

JS:
let holidaySelectDay


function uselessFunction() { 
  return new Promise(resolve => {
      copyDiv()
      resolve(0);
  });
}

async function f1() {
  var x = await uselessFunction();
  choicesInit('select', {searchEnabled: false, shouldSort: false, itemSelectText: ''});
}

f1();

/* -------------------- */

/* Получаем селект, выводим его в консоль */
function copyDiv() {
  holidaySelectDay = document.querySelector("select");
  console.log(holidaySelectDay);
}

/* Инитим choices.js. Получаем селект и параметры */
function choicesInit(select, param) {
  const elements = Array.from(document.querySelectorAll(`${select}`))

  const item = elements.filter(function (elements) {
    if (!elements.getAttribute('data-choice')) { return elements }
  });
  const instances = item.map((element) => {
    return new Choices(element, param)
  });
}

Alexandroppolus 07.02.2020 13:13

CryNet,

консоль перерисовывается уже после choicesInit, и показывает обновленный select

на 23 строке сделай console.log(holidaySelectDay.className);
тогда будет видно, что класса нет.

CryNet 07.02.2020 13:30

Цитата:

Сообщение от Alexandroppolus (Сообщение 519763)
CryNet,

консоль перерисовывается уже после choicesInit, и показывает обновленный select

на 23 строке сделай console.log(holidaySelectDay.className);
тогда будет видно, что класса нет.

Дело не в этом :)

https://jsfiddle.net/gns6q3kv/2/

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

рони 07.02.2020 13:38

CryNet,
копию сделайте до изменения а не после
async function f1() {
  var x = await uselessFunction();
  holidaySelectDay = holidaySelectDay.outerHTML
  choicesInit('select', {searchEnabled: false, shouldSort: false, itemSelectText: ''});
  
  let di = document.querySelector("body")
  
	di.insertAdjacentHTML('afterbegin', holidaySelectDay)
}

CryNet 07.02.2020 13:57

Цитата:

Сообщение от Alexandroppolus (Сообщение 519763)
CryNet,

консоль перерисовывается уже после choicesInit, и показывает обновленный select

на 23 строке сделай console.log(holidaySelectDay.className);
тогда будет видно, что класса нет.

Цитата:

Сообщение от рони (Сообщение 519771)
CryNet,
копию сделайте до изменения а не после
async function f1() {
  var x = await uselessFunction();
  holidaySelectDay = holidaySelectDay.outerHTML
  choicesInit('select', {searchEnabled: false, shouldSort: false, itemSelectText: ''});
  
  let di = document.querySelector("body")
  
	di.insertAdjacentHTML('afterbegin', holidaySelectDay)
}

Мдауж... туплю. Спасибо :)

https://jsfiddle.net/qLmeafcx/1/


Часовой пояс GMT +3, время: 07:47.