javascript - 重复调用命中 php 文件的函数

Question

我有一个 php 文件，它回显了一个 json 编码的词。我有一个检索这个词的 javascript 函数。我想调用这个函数，检查返回的单词是否已经在数组中，如果是，我想调用另一个单词。我基本上想重复这个过程，直到我得到一个不在我的数组中的词。我正在为此苦苦挣扎，所以我需要一些关于如何做到这一点的建议。我只想在客户端执行此操作。目前，当我调用 getWord() 时，它返回 undefined 但该函数本身有效，所以我怀疑当时还没有检索到该词。

<?php
$sql = "SELECT * FROM words ORDER BY RAND() LIMIT 1";

$result = $db->query($sql);

$row = $result->fetch_assoc();
$word = $row['word'];
echo json_encode($word);
?>


function getWord(){
        var word;
        $(document).ready(function(){
            $.getJSON("getWord.php",function(data){
                word = data;
                alert("1st alert: " + word);
            });

        });
        return word;
    }

$(document).ready(function() {
            $("#newRound").on("click",function(){
                    currentWord = getWord();
                    alert("SEcond alert: " + currentWord);
                    //check here if data is already in wordsSoFar arary and if it is, get another word from getword.php
                    document.getElementById("input1").style.visibility = 'visible';
                    //currentWord = data; //set the current work
                    lives = 6; //reset lives
                    tracker = 0; 
                    incorrectLettersGuessed = "";
                    allGuessedLetters = "";
                    updateLetters();
                    document.getElementById('hangman').innerHTML = '<center><img src="stage1.png"></center>';
                    createTable(currentWord);
                    output.innerHTML = '<center>'+messages.validLetter + '</center>';
                    alert(currentWord);

            });
    });

Answer 1

问题是在程序的其余部分完成运行后，对 php 服务器的 ajax 调用得到解析。此时 getWord() 函数是这样工作的:

1. 创建一个变量word。此时word等于undefined。
2. 开始异步调用 php 服务器。
3. 返回 word，此时它仍然等于 undefined。
4. 返回word后，异步调用将得到解决，回调函数将被执行。

您不应从 getWord() 返回单词，而应返回此异步调用创建的 promise 并在主函数中处理结果。像这样:

function getWord(){
    return $.getJSON("getWord.php");
}


$(document).ready(function() {
        $("#newRound").on("click",function(){
                getWord().done(function(currentWord) {
                    alert("The current word is " + currentWord);
                    //check here if data is already in wordsSoFar arary and if it is, get another word from getword.php
                    document.getElementById("input1").style.visibility = 'visible';
                    //currentWord = data; //set the current work
                    lives = 6; //reset lives
                    tracker = 0; 
                    incorrectLettersGuessed = "";
                    allGuessedLetters = "";
                    updateLetters();
                    document.getElementById('hangman').innerHTML = '<center><img src="stage1.png"></center>';
                    createTable(currentWord);
                    output.innerHTML = '<center>'+messages.validLetter + '</center>';
                    alert(currentWord);
                });


        });
});

除此问题外，在getWord函数中使用$(document).ready是没有必要的。只有在加载文档时才会调用该函数。