细说JavaScript ajax异步请求return undefined

在制作注册表单验证时我们需要通过ajax请求数据，例如我们需要请求数据库中的用户名判断是否存在，这时我们就需要return，再者我们很多时候需要使用数据库中的数据，这时我们也需要将数据返回出去。

我们看下下面验证数据库是否存在输入的用户名却return undefined的例子

// 发送ajax请求
$.ajax({
    type: "POST",
    url: "checkName.php",
    data: {
        username: $inputVal
    },
    success: function(responseText) {
        if (responseText === "denied") {
            // 若已存在
            return false;
        } else {

            return true;
        }

    }
});

在这我们我们发送了一个异步请求来验证输入的用户名，但结果却没有想的那样返回true or false，却返回了undefined，这是因为你发送了异步请求，但请求的数据还没返回回来，就已经执行到return语句，自然就返回了undefined。

所以我们需要将异步请求变为同步，用回调函数来发送return值，并在ajax的success回调中用变量存储返回值，。

var getFalse = function() {
         return false;
    },
    getTrue = function() {
        return true;
    };

var getAjax = function(successFn, failFn) {
    var callBackReturn;
    // 发送ajax请求
    $.ajax({
        type: "POST",
        url: "checkName.php",
        // 发送同步请求
        async: false,
        data: {
            username: $inputVal
        },
        success: function(responseText) {
            if (responseText === "denied") {
                $tipObj.html(tipText[2]);
                callBackReturn = failFn();
            } else {
                $tipObj.html(tipText[3]);
                callBackReturn = successFn();
            }

        }
    });

    return callBackReturn;
};