jQuery AJAX问题?或者JS OOP作用域问题

jQuery AJAX issue? Or JS OOP scope issue?

本文关键字:问题 OOP 作用域 JS AJAX jQuery 或者      更新时间:2023-09-26

我试图在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是异步的,我认为我已经处理了使用回调函数"onComplete"

任何关于这个话题的帮助将非常感激!

您将无法立即从调用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访问是非常危险的,我不建议这样做