Как написать асинхронную функцию на чистом JS для мобильного браузера Chrome?

Question

[Dimka5]

В настольном Chrome конструкция async/await работает а в мобильном нет (сообщение не выводится, а без async выводится). Как написать эту функцию для мобильного браузера?

window.addEventListener('load', async () => {
  alert('привет')
})

Comments

[Lynn «Кофеман»]

А зачем тут async?

[Dimka5]

За тем что внутри может быть более сложный код с await. А это просто тестовый вариант, для проверки в браузере.

[Сергей Соколов]

на CanIUse пишут, что Chrome 70 под ведроид поддерживает.

[Сергей Соколов]

А попробуйте по паспорту не анонимно:

const onLoad = async function() {
  alert('привет');
};

window.addEventListener('load', onLoad);

[Сергей Соколов]

Заморочился, проверил сейчас на мобильном Chome: в вашем виде у меня работает прекрасно. Чуть изменил тест:

window.addEventListener('load', async () => {
	const div = document.createElement("div");
	div.innerText = "Привет!";
  document.body.appendChild(div);
})

[Сергей Соколов]

у меня Chrome 70.0.3538.80 / Android 5.1.0

Answer 1

[Dimka5]

Действительно Сергей Соколов отдельно этот код на мобильной версии Chrome 70.0.3538.80 с async работает. В моём случае возможно ошибка в другом...

Answer 2

[Interface]

Транспилируйте ваш код: babel, typescript

Или не поддерживайте браузеры не поддерживающие нужные вам синтаксические фичи. Не вижу других адекватных вариантов.

Answer 3

[Максим Яковенко]

Зависит от того, на какой версии браузера ты собираешься запускать код. Стрелочные функци вроде включены в стандарт ES5, так что они должны поддерживатся современными браузерами, а вот конструкции async/await по дефолту не поддерживаются вcеми браузере, для того что чтобы они заработали везде нужен babel. Лучше вместо этого использовать Promise, callback и замыкания. А, в принципе, чтобы проверить какую-то фичу, используй https://caniuse.com/

Answer 4

[Ihor Bratukh]

В jQuery есть аналог Promise - Deferred объекты. Если не используете jQuery можете найти и вытянуть отдельные функции или найти уже готовый в сети.

(function ($) {
    'use strict';

    void function main() {
        // Пример использования promise
        promise(function (resolve, reject) {
            resolve('example data');
        }).done(function (data) {
            console.log(data); //> "example data"
        });

        // Пример использования promiseAll
        var deferreds = [$.Deferred().resolve(1), $.Deferred().resolve(2), $.Deferred().resolve(3)];
        promiseAll(deferreds).done(function () {
            console.log(arguments); //> [1, 2, 3]
        });
    }();

    function promise(callback) {
        var deferred = $.Deferred();
        callback && callback(deferred.resolve, deferred.reject);
        return deferred;
    }

    function promiseAll(deferreds) {
        return $.when.apply(null, deferreds);
    }

}(jQuery));