在继续之前等待功能完成的更简洁的方法

Question

首先，我从 public api 中随机获取了一段引述。只有在我真正有一个报价之后，我才想呈现包含该报价的页面。

我是 JavaScript 新手，所以如果这是一个愚蠢的问题，请多多包涵。

在继续呈现页面之前，我一直在努力等待对 return 的 api 调用。我想执行以下操作，但这不起作用，因为 res.render 将在我引用之前被调用。（注意：我使用的是 Express 和 Axios）

async function getRandomQuote() {
    try {
        const res = await axios.get("https://api.quotable.io/random?tags=famous-quotes")
        console.log(`${res.data.content} - ${res.data.author}`)     //This prints fine
        return res.data
    } catch(e) {
        console.log('error', e)
    }
}

app.get('/', (req, res) => {

    const quote = getRandomQuote()
    console.log(`${quote.content} - ${quote.author}`)    //This prints 'undefined' because 'getRandomQuote' isn't finished yet

    res.render('home', { quote })
})

我想到的唯一方法如下，但我发现这真的很乱。有没有更清洁的方法来做到这一点？或者我是否总是需要将所有我想要等待的代码行放在一个异步函数中？

async function getRandomQuote() {
    try {
        const res = await axios.get("https://api.quotable.io/random?tags=famous-quotes")
        console.log(`${res.data.content} - ${res.data.author}`)     //This prints fine
        return res.data
    } catch(e) {
        console.log('error', e)
    }
}

app.get('/', (req, res) => {

    const getQuoteAndRender = async() => {
        const quote = await getRandomQuote()
        console.log(`${quote.content} - ${quote.author}`)    //This prints only if I wrap everything in yet another aync function, otherwise it will not wait for 'getRandomQuote' to complete

        res.render('home', { quote })
    }
    getQuoteAndRender()
})

(注意：我意识到在我成功获得报价后呈现页面也不理想，因为这意味着如果报价 api（出于某种原因）没有，我根本不会获得页面工作。但现在我只想知道如何在等待中完成此操作。）

Answer 1

这是您需要做的。通过这样做 app.get('/', async (req, res)

让你的控制器 async

app.get('/', async (req, res) => {

const quote = await getRandomQuote()
console.log(`${quote.content} - ${quote.author}`)    //This prints 'undefined' because 'getRandomQuote' isn't finished yet

res.render('home', { quote })
})

Answer 2

试试这个：

getRandomQuote()
.then(quote => {
  console.log(`${quote.content} - ${quote.author}`) 
  res.render('home', { quote })
});

在继续之前等待功能完成的更简洁的方法

Clearner way to wait for function to complete before continuing

javascript

async-await