javascript - 需要帮助使用具有两个功能的 await 或 promises

Question

您创建了两个函数，一个用于从文件中读取单词，另一个用于将这些单词放入选择组件中。我认为的问题是那个是异步执行的，但我不知道把我的 promise 或等待放在哪里。

我已阅读有关这些概念的文章，但似乎没有一篇适用于我的示例，因此非常感谢您提供任何帮助。

我的第一个调用异步函数的函数。

  <script>

                            function readinfiles()
                            {

                                    var options = "<option value ='0'>select</option>";
                                    alert("hi");
                                    var values= getTxt();
                                    alert(values);


                            }

                    </script>

我的第二个获取信息的函数

 <script src="jquery.js"></script>
                    <script>
                    getTxt =  function (){

                      $.ajax({
                            url:'fileslist.txt',
                            success: function (data){
                            return data.split('\n');
                            }
                      });
                    }
                    </script>

目前 values 数组未定义，如能帮助重构这些函数，我们将不胜感激

Answer 1

首先，我建议将这两个函数合并为一个，并在其前面加上 async 关键字。这样你就可以在里面使用一个 promise ，它实际上试图通过 ajax 获取数据。这样的 promise 可以被拒绝或解决。如果它已解决 - 在您的情况下，如果它成功加载了文件列表 - 而不是返回数据，您可以使用数据解决 promise 。

这是一些代码:

async function readinfiles() {

  var options = "<option value ='0'>select</option>";
  alert("hi");
  var promise = new Promise(function(resolve, reject) {

    $.ajax({
      url: 'fileslist.txt',
      success: function(data) {
        resolve(data.split('\n'));

      }
    });
  });

  var values = await promise;
  alert(values);
}
readinfiles();

澄清一下，这里发生了魔法:

  var values = await promise;
  alert(values);

如您所见，我们正在创建一个名为 values 的新变量，并将 await 关键字指示的 promise 结果分配给它。这意味着它不会在 promise 被解决或拒绝之前执行下一个函数 - alert()。