Как сделать так, чтобы javascript проверял изображение, существовал синхронный ответ

Question

У меня есть эта функция JavaScript, которая проверяет, существует ли определенный путь изображения.в настоящее время функция не завершается до выполнения остальной части кода.если кто-нибудь может порекомендовать способ заставить программу ждать завершения этой функции, прежде чем продолжать выполнение, это было бы удивительно.Спасибо!

var flag = false;

function checkImageExists(imageUrl, callBack) {
    var imageData = new Image();
    imageData.onload = function () {
        callBack(true);
    };
    imageData.onerror = function () {
        callBack(false);
    };
    imageData.src = imageUrl;
}

checkImageExists(card.logoSrc, function (existsImage) {
    if (existsImage === true) {
        flag = true;
        console.log(card.logoSrc + ' ' + flag);
    } else {
        flag = false;
        console.log(card.logoSrc + ' ' + flag);
    }
});
console.log('flag ' + flag);

Журнал консоли этой программы отображает URL-адрес изображения и правильное значение флага, но это отображается только после того, как журнал 'flag' + flag все время выполняется как ложный из-за функциине заканчивая его исполнение.Любые советы или рекомендации будут с благодарностью еще раз спасибо!

Answer 1

Вы можете использовать async/await, чтобы заставить его работать так, как если бы оно было синхронным.

function checkImageExists(imageUrl) {
  return new Promise((resolve, reject) => {
    let imageData = new Image();

    imageData.onload = function () {
        resolve(true);
    };
    imageData.onerror = function () {
        reject(false);
    };

    // not really sure why you have this here, but ok
    imageData.src = imageUrl;
  });
}

async function init() {
  try {
    const isImageLoaded = await checkImageExists(card.logoSrc);
    console.log(isImageLoaded);
  } catch(error) {
    console.error(error);
  }
}

init();

Обратите внимание, что это непроверенный код, это просто представление идеи решения.

Пример: https://repl.it/repls/KhakiTreasuredTasks