Question

这似乎是一个荒谬的微不足道的问题，但我无法解决它。

我有这个功能。 var q被分配给一个字符串数组。调用函数时，alert(q)成功打印整个数组。

function initQuestions() {
    $.post("quiz.php", { 'func': 'load' }, function(data) {
        var q = data.split(".\n");
        alert(q);
        return q;
    });
}

然而，当我尝试使用该函数时（如下面以2种方式描述），我被告知数组是未定义的。为什么会这样？

var questions;

$(function() {
    //This doesn't work
    questions = initQuestions();
    alert(questions);

    //Neither does this
    alert(initQuestions());
});

经过进一步研究，我添加了回调initQuestions()，但结果相同。

Answer 1

后调用是异步的：Async Javascript

基本上，initQuestions（）函数在null完成之前返回post

想到这样：

function initQuestions() {
    $.post("quiz.php", { 'func': 'load' }, function(data) {
        var q = data.split(".\n");
        alert(q);
        return q; // <- returns to the caller of function(data), not initQuestions()!
    });
    return null; // <- This happens before function(data) is complete
}

为了使其按预期工作，您需要在帖子成功并完成时提供回调。

function initQuestions(callback) {
    $.post("quiz.php", { 'func': 'load' }, function(data) {
        var q = data.split(".\n");
        alert(q);
        callback(q);
    });
}

var questions;

function doSomthingWithQuestions() {
    alert(questions); // <- should work
    // do the things with the questions
}

$(function() {
    initQuestions(function(result) {
       questions = result;
       doSomethingWithQuestions();
    });

    // Don't use `questions` here as the callback hasn't fired yet. 
});

Answer 2

帖子是异步的，return不会转到你期望的函数，而是转到成功处理程序：

function initQuestions() {
  $.post("quiz.php", { 'func': 'load' }, function(data) { // <- this function has that return
    var q = data.split(".\n");
    alert(q);
    return q;
  });
}

here是如何抑制异步行为并实现你想要的

修改

正如有些人在这里所说，asych = false是一个坏主意，因为它会冻结你的JS代码，直到请求完成（可能需要几秒钟才能连接慢），因此解决方案就是在成功时做任何你想做的事情功能：

questions = initQuestions(); //wrong fillDivsWithData(questions); //use callback instead: function initQuestions() { $.post("quiz.php", { 'func': 'load' }, function(data) { var q = data.split(".\n"); console.log(q); //diplay this in you browser's JS console fillDivsWithData(q); }); }

结果是一样的，但是由于asynch请求，如果你有potatoe互联网连接，你的JS代码不会冻结几秒钟。

Answer 3

var questions; // undefined right now
initQuestions(function(_questions){
  questions = _questions; // the value has been set thanks to the anonymous function you passed as the callback
})

function initQuestions(callback  // this is a callback function reference) {

  // This HTTP Post call takes time to complete and is done asynchronously
  $.post("quiz.php", { 'func': 'load' }, function(data) {
    var q = data.split(".\n");
    // Luckily your initQuestions now takes in a callback function
    // You have access to the callback function here and when ready you can use it
    callback(q);
  });
  // JavaScript engine doesn't wait for your HTTP call to complete 
  // and will continue to execute the function
  // In this case, your function isn't returning anything hence undefined

}

Javascript数组未定义？

3 个答案: