Как выполнить обещание синхронно?

1

Я использую dom-to-image.js для преобразования dom в png-образ. Поскольку dom-to-image.js использует обещание, код выполняется асинхронно. Я хочу выполнить. Then функцию синхронно.

У меня есть следующий код:

domtoimage.toPng(document.getElementById("main")).then(function(dataUrl) {
    console.log(dataUrl);
}).catch(function(error) {
    console.error('oops, something went wrong!', error);
});

console.log("this console should be executed after console.log(dataUrl)")

Сначала я хочу выполнить функцию.then перед выполнением console.log("this console should be executed after console.log(dataUrl)").

Пожалуйста, скажите мне, как это сделать.

  • 2
    почему бы не положить его в то время? или делать цепочки?
  • 3
    Это похоже на проблему XY . Поверьте мне, вы не хотите выполнять обещания синхронно, потому что 1. это невозможно и 2. это может снизить производительность. Чего вы на самом деле пытаетесь достичь здесь?
Теги:
promise
es6-promise

3 ответа

0

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

Похоже, пакет синхронизированного обещания кажется, что это должно сработать. В вашем случае (предупреждение - не проверено..):

const dti = () => docstoimage.toPng(document.getElementById("main"))
  .then(dataUrl => console.log('url: ', dataUrl))
  .catch(err => console.error('oops: ', err))

const sp = require('synchronized-promise')
const syncDti = sp(dti)
syncDti() // performs the 'synchronized version'

console.log("this console should be executed afterwards")
0

Вы не можете дождаться, когда в Javascript произойдет асинхронное вычисление. Единственное, что вы можете сделать, это объявить, что вы хотите, когда это вычисление будет выполнено.

Использование async/await делает код более похожим на то, что вы описываете, но вычисление по-прежнему асинхронно. Вы можете либо переместить журнал в then:

domtoimage.toPng(document.getElementById("main")).then(function(dataUrl) {
    console.log(dataUrl);
    console.log("this console should be executed after console.log(dataUrl)")
}).catch(function(error) {
    console.error('oops, something went wrong!', error);
});

Или используйте async/await, чтобы сделать это более похожим на обычный код:

async function myFunc(){    
    try{
        dataUrl = await awaitdomtoimage.toPng(document.getElementById("main"))
        console.log(dataUrl);
        console.log("this console should be executed after console.log(dataUrl)")
    } 
    catch(error) {
        console.error('oops, something went wrong!', error);
    }
-2

Если вы можете использовать, я бы рекомендовал async/await потому что это именно то, что вы хотите.

Ваш код должен быть структурирован следующим образом:

async function mySynchronousPromise(){
   await domtoimage.toPng(document.getElementById("main")).then(function(dataUrl) {
        console.log(dataUrl);
   }).catch(function(error) {
        console.error('oops, something went wrong!', error);
   });
   console.log("this console should be executed after console.log(dataUrl)")
}

Вы можете найти дополнительные обучающие онлайн:

https://hackernoon.com/6-reasons-why-javascripts-async-await-blows-promises-away-tutorial-c7ec10518dd9

Ещё вопросы

Сообщество Overcoder
Наверх
Меню