为什么Javascript async await在这种情况下不起作用？

我对Javascript比较陌生，还没有找到一种方法让我的代码在执行下一步之前等待结果。我对回调做了一些研究，但我的代码似乎无法使其正常工作

我正在使用Flask框架开发一个网页。以下代码调用其中一个端点以获取JSON响应（

name

是我发送给端点的参数，

data

是我返回的JSON响应）：

问题是Javascript没有等待这个响应，而是在我的程序中执行接下来的步骤。这就是我尝试过的-

$.getJSON('/if_name_exists', {
    name: "sample_name",
}, function(data) {
    if (data.check == "True") {
        alert("Name already exists! Please enter another name.");
        return false;
    }
});

(async () => { await wait(2000); console.warn('done') })();

---

但是我的代码仍然没有等待响应并执行接下来的步骤。如何解决此问题？

简短回答

带着承诺，或者回电

看起来您正在尝试创建一个异步函数，它等待来自ajax请求的响应/错误

下面是一个工作示例，定义了两个函数，一个是发出请求“makeRequest”的函数，这将返回一个承诺，在网络请求成功或失败时解决

第二个函数是调用发出请求的函数的函数，这里您将看到我放置了一个try/catch示例

这看起来就是你想要的

const makeRequest = async () => {
    return new Promise((resolve, reject) => {

        $.getJSON('/if_name_exists', {
            name: "sample_name",
        }, function(data) {
            if (data.check == "True") {
                alert("Name already exists! Please enter another name.");
                return resolve(false);
            }

            return resolve(true);
        }, reject);

    })
};

const runRequest = async () => {
    try {

        const result = await makeRequest();

        // This will not log until your request has succeeded.
        console.log(`Result = ${result}`);
    } catch (e) {
        console.log("Error making request", e);
    }
}



// Run the request
runRequest();

听起来您应该查找承诺、回调和异步控制流，总的来说，值得一读

只需使用Promise API，就可以在不使用async/await的情况下编写runRequest。例如

const runRequest = () => {

    makeRequest()
        .then((result) => {
            console.log(`Result = ${result}`);
        })
        .catch((error) => {
            console.log("Error making request", e);
        });
}

或者最后，您可以使用回调编写它

const makeRequest = (success, error) => {
    $.getJSON(
        "/if_name_exists",
        {
            name: "sample_name"
        },
        success,
        error
    );
};

const runRequest = () => {
    makeRequest(
        data => {
            if (data.check == "True") {
                alert("Name already exists! Please enter another name.");
                return resolve(false);
            }
        },
        error => {
            console.log("Error making request", e);
        }
    );
};

// Run the request
runRequest();

---

注意：如果$.getJSON返回一个承诺，那么您可以忽略承诺构造函数调用，不确定它是否返回了，即只支持回调，因此我在makeRequest中显式返回了一个承诺。

您好，感谢您的回答。我尝试了你的第一个解决方案，但似乎不起作用。例如，这个

$.getJSON

代码片段位于另一个函数中，理想情况下，该函数应该根据响应退出。但是，接下来的几行仍然会执行—例如，在此之后仍然会显示一条

警报（“消息”）

。听起来您希望解析（false）为拒绝（false）。如果在您的示例data.check==“True”也尝试了该操作，但未起作用，则会触发捕获：/然后我怀疑您的代码中有其他错误。我的答案中的代码片段都是带有async/await和without以及简单回调的承诺的基本示例

const makeRequest = (success, error) => {
    $.getJSON(
        "/if_name_exists",
        {
            name: "sample_name"
        },
        success,
        error
    );
};

const runRequest = () => {
    makeRequest(
        data => {
            if (data.check == "True") {
                alert("Name already exists! Please enter another name.");
                return resolve(false);
            }
        },
        error => {
            console.log("Error making request", e);
        }
    );
};

// Run the request
runRequest();