javascript - For 循环从不执行(Javascript/Jquery)

Question

这个问题已经有答案了:

How do I return the response from an asynchronous call? (42 个回答)

Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference (7 个回答)

已关闭 7 年前。

因此，如果我替换 $.get('/preceed_with_an.txt', function(data){var ans = data.split('\n')});，for 循环就会运行与 ans = ["filler","more filler"]但是当 $.get 行位于其中时，它拒绝执行 for 循环，并且不会将任何内容写入控制台。对于上下文，我正在编写代码来告诉您是否应该在单词前使用 A 或 AN。您使用 for 的单词均位于 preceed_with_an.txt 中的单独行中。我已经检查了 $.get 函数，并且文件已正确写入数组。

$(document).on('input',$('#givenWord'),function(){
      var ans = new Array;
      $.get('/preceed_with_an.txt', function(data){var ans = data.split('\n')});  
 for (var i = 0; i < ans.length; i++){
    console.log("help");
    if (ans[i] == $('#givenWord').lower){
      var answer = $("#answer");
      console.log("AN");
      $(answer).text("An");
      break;
    }else{
      var answer = $("#answer");
      console.log("A")
      $(answer).text("A");
    }
  }
});

Answer 1

get() 是异步的，因此 ans.length 等于 0，因为数据在 for 循环执行后返回。

您必须在 get() 回调函数中执行 for 循环:

$.get(url, function(data) {
   var arr = data.split(',');
   for(...) {
      //...
   }
});

执行流程(您的代码)

1. 创建 ans 数组
2. 调用get()函数
3. 尝试执行 for 循环(没有可用数据)
4. get()返回数据

异步调用

1. 创建 ans 数组
2. 在回调中使用 for 循环调用 get() 函数
3. get() 返回数据并执行回调 --> for 循环数据

示例

检查控制台的结果。即使在 console.log() 之前调用 setTimeout 函数，代码也会继续执行并等待回调的答案(1 秒后)。当结果出来后，执行回调:

var def = $.Deferred();

def.done(function(data) {
  console.log(data);
});

//Asynchronus call (delays for 1 second)
setTimeout(function() { 
  def.resolve('Callback after 1 second') 
}, 1000);

//Execute immediately
console.log('Write something!');

//Console results
// 1. Write something
// 2. callback (after 1 second)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

检查这些有关异步函数的链接:

jQuery.get()

Async