实施 javascript 承诺或 async/await

Question

我是编程新手； promises 和 async/await 功能的概念是我费了好大劲才搞清楚的。但我知道在这种情况下我应该利用它。

背景：使用 Node、Express、XML2js npm 包构建原型银行应用程序以解析我正在使用的 XML 数据、XMLhttpRequest 和 EJS用于模板。我的 server.js:

中有这条获取路线


    const parseString = require('xml2js').parseString;
    
    app.get('/home', (req, res) => {
     makeCall(`<root>
      <slipped>
        <mail>
          <alike>-1845676614.3625278</alike>
          <paid>uncle</paid>
          <kill>something</kill>
          <name>Stephen<name>
          <men>such</men>
          <firm>rubbed</firm>
          <using>yesterday</using>
        </mail>
      </slipped>
      <pour>-1247721160</pour>
      <poet>language</poet>
      <sets>-1907281866</sets>
      <treated>proper</treated>
      <judge>781679047</judge>
     </root>`)
    //Putting the format of the XML *response* above, to show what I am rendering from
      setTimeout(function () {
        res.render('home.ejs', {
          name: dataList[0].root.slipped.mail.name
        })
      }, 1000);
    })

我想让应用程序等待并完成 makeCall()，在 home.ejs 被渲染之前。如果我不等待，那么它将传播旧值。它现在确实可以正常工作，但我相信有一种更有效的方法可以做到这一点。

如何使用 promises 或 async/await 行为而不是 setTimeout 重写上述逻辑？

作为参考，makeCall():


    const makeCall = (call) => {
      myRequest.open('POST', 'http://111.222.3.444:55555')
      myRequest.setRequestHeader('Content-Type', "application/x-www-form-urlencoded");
      myRequest.send(call)
      myRequest.onload = () => {
        if (myRequest.status === 200) {
          parseString(myRequest.responseText, (err, result) => {
            dataList.unshift(result)
          })
        } else {
          console.log('Something went wrong, status code: ' + myRequest.status)
        }
      }
    }

提前感谢您能为我提供的任何帮助:)

Answer 1

Return makeCall 中的承诺，因此您可以在 main 方法中等待它。这是一个例子

const makeCall = (call) => {
  return new Promise((resolve, reject) => {
    myRequest.open('POST', 'http://111.222.3.444:55555')
    myRequest.setRequestHeader('Content-Type', "application/x-www-form-urlencoded");
    myRequest.send(call)
    myRequest.onload = () => {
      if (myRequest.status === 200) {
        parseString(myRequest.responseText, (err, result) => {
          dataList.unshift(result);
          resolve();
        })
      } else {
        console.log('Something went wrong, status code: ' + myRequest.status)
        reject();
      }
    }
  });
}

然后您可以等待它完成以继续您的主要方法。你可以通过使用像这样的承诺来做到这一点：

makeCal(...)
.then(() => your_success_logic)
.catch((e) => your_error_logic);

或者您可以这样使用 async/await：

app.get('/home', async (req, res) => {
    await makeCal(...);
    res.render('home.ejs', {
      name: dataList[0].root.slipped.mail.name
    });
});

Answer 2

您可以使用 new Promise 构造函数使某些内容异步。它需要一个带有两个回调（解析、拒绝）的函数。如果失败，则拒绝它。如果成功，您可以使用 resolve。节点 10 及以上，您可以像这样使用 async 函数，并使用 await 关键字等待异步函数解析或拒绝，然后再向前移动。

const parseString = require('xml2js').parseString;
    
   app.get('/home', async (req, res) => {
    await makeCall(`<root>
     <slipped>
       <mail>
         <alike>-1845676614.3625278</alike>
         <paid>uncle</paid>
         <kill>something</kill>
         <name>Stephen<name>
         <men>such</men>
         <firm>rubbed</firm>
         <using>yesterday</using>
       </mail>
     </slipped>
     <pour>-1247721160</pour>
     <poet>language</poet>
     <sets>-1907281866</sets>
     <treated>proper</treated>
     <judge>781679047</judge>
    </root>`)

   //Putting the format of the XML *response* above, to show what I am rendering from
    res.render('home.ejs', {
      name: dataList[0].root.slipped.mail.name
    })
   }) 

const makeCall = (call) => {
  return new Promise((resolve, reject) => {
    myRequest.open('POST', 'http://111.222.3.444:55555')
    myRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
    myRequest.send(call)
    myRequest.onload = () => {
      if (myRequest.status === 200) {
        parseString(myRequest.responseText, (err, result) => {
          if (err) {
            reject(err)
          } else {
            dataList.unshift(result)
            resolve()
          }
        })
      } else {
        console.log('Something went wrong, status code: ' + myRequest.status)
        reject(new Error(''Something went wrong, status code: ' + myRequest.status'))
      }
    }
  })
}

实施 javascript 承诺或 async/await

Implement javascript promise or async/await

javascript

node.js

xmlhttprequest

ejs

xml2js