jQuery AJAX 问题？还是 JS OOP 范围问题？答案

【问题标题】：jQuery AJAX issue? Or JS OOP scope issue?jQuery AJAX 问题？还是 JS OOP 范围问题？
【发布时间】：2014-07-07 12:08:19
【问题描述】：

我正在尝试在 javascript 中创建一个数据库处理程序类。我想通过简单地使用来调用类：

var databaseHandler = new DatabaseHandler();
result = databaseHandler.getResult("SELECT * FROM login");

我已经创建了类，并为 ajax 函数使用了回调（以便等待返回 ajax 结果）。但是我仍然收到“未定义”作为我的结果。如果我在 onComplete 函数中使用 console.log(a)，我会得到一个预期结果的数组。

(function(window){

    //Database class
    function DatabaseHandler(){

        //Query
        this.query = function(query, whenDone){
            request = $.ajax({
                url: "../optiMizeDashboards/php/DatabaseQuery.php",
                type: "POST",
                data: {query : query},
                dataType: "JSON"
            });

            request.done(function(output) {
                whenDone(output);
            });

            request.fail(function(jqXHR, textStatus) {
                console.log(textStatus);
            });
        };

        //Get result
        this.getResult = function(query){
            this.query(query, this.onComplete);
        };

        //Ajax callback
        this.onComplete = function(a){
            return a;
        };
    }

    //Make available to global scope
    window.DatabaseHandler = DatabaseHandler;

}(window))

我的问题是：这与变量范围或 ajax 的工作方式有关吗？我已经阅读了所有解释 ajax 是 ASYNC 的答案，我认为我已经通过使用回调函数“onComplete”处理了这个问题

我们将不胜感激有关此主题的任何帮助！

【问题讨论】：

你没有正确实现回调系统

标签： javascript jquery ajax oop

【解决方案1】：

您将无法通过调用 getResult 立即返回结果，因为底层 jQuery POST 请求是异步的，相反您需要传递一个回调函数，该函数最终会从服务器接收结果。

类似的东西：

(function(window){
    //Database class
    function DatabaseHandler(){
        //Query
        this.query = function(query, whenDone){
            request = $.ajax({
                url: "../optiMizeDashboards/php/DatabaseQuery.php",
                type: "POST",
                data: {query : query},
                dataType: "JSON"
            });
            request.done(function(output) {
                whenDone(output);
            });
            request.fail(function(jqXHR, textStatus) {
                console.log(textStatus);
            });
        };
        //Get result
        this.getResult = function(query, callback){
            this.query(query, callback);
        };
    }

    //Make available to global scope
    window.DatabaseHandler = DatabaseHandler;

}(window))

// then use it like so
var databaseHandler = new DatabaseHandler();
result = databaseHandler.getResult("SELECT * FROM login", function(data) {
    //do something with data
});

PS：在客户端公开对数据库的直接 SQL 访问是非常危险，我不建议这样做

【讨论】：