Question

我在设置网页中某些textContent的{{1}}之前尝试将一些API调用链接起来。我可以通过将它们粘贴到控制台中来单独执行以下ajax API调用，但当我将它们链接为promises时，我得到spans。

getFirstData() is undefined

这是在var first_data = [], second_data = []; function getFirstData(){ var xhr = new XMLHttpRequest(); var url = "/API/first-data?format=json" xhr.onreadystatechange = function() { if (xhr.readyState == 4 && xhr.status == 200) { first_data = JSON.parse(xhr.responseText); return Promise.resolve('1'); } } xhr.open("GET", url, true); xhr.send(); } /*getSecondData is the same, but with a different API url. I'll DRY these two into one function that takes a url argument when I get it working.*/ getFirstData().then(getSecondData).then(createPage);之前的<script>代码之间。那么在最后一行调用</body>导致解释器说它是getFirstData()的错误是什么？作为参考，在网络日志中，发送getSecondData（）并返回正常。

（注意：我特意在没有JQuery的情况下尝试这样做。）

Answer 1

getFirstData没有返回它返回undefined的承诺，这是不可能的。

function getFirstData(){
    return new Promise(function(resolve) {
      var xhr = new XMLHttpRequest();
      var url = "/API/first-data?format=json"
      xhr.onreadystatechange = function() {
          if (xhr.readyState == 4 && xhr.status == 200) {
              first_data = JSON.parse(xhr.responseText);
              resolve('1');
          }
      }
      xhr.open("GET", url, true);
      xhr.send();
    });
}

Answer 2

出现此问题的原因是您的函数在返回.focus之前返回undefined（换句话说，在返回之前到达功能块的末尾）。

你的函数必须立即返回一个Promise对象，该对象在最终解析你的AJAX处理程序之前变为挂起。

我还使用提供的Promise.resolve('1')参数添加错误处理，这是Promise对象的标准。

reject

然后在可靠的链中抓住它：

function getFirstData(){
    return new Promise(function(resolve, reject) { // encapsulate code in a promise which returns immediately
      var xhr = new XMLHttpRequest();
      var url = "/echo/json"
      xhr.onreadystatechange = function() {
          if (xhr.readyState == 4 && xhr.status == 200) {
              first_data = JSON.parse(xhr.responseText);
              return resolve('1');
          }
          else {
            return reject('There was an error!') // reject the promise if error occurs
          } 
      }
      xhr.open("GET", url, true);
      xhr.send();
    });
}

见工作jsfiddle

链式承诺给出了未定义的函数错误，但我可以单独执行这些函数

2 个答案: