为什么我的方法没有返回对象

Why is my method not returning the object

本文关键字:返回 对象 我的 方法 为什么      更新时间:2023-09-26

我的ajax响应是正确的,但我无法将响应对象返回给我的方法调用。问题出在if语句的第一部分。这是我第一个尝试面向对象的项目。请让我知道如何解决这个问题和任何其他OOP代码的建议是非常欢迎的。

$("#search-btn").on('click', function(e) {
        e.preventDefault();
        searchTerm = $("#search-input").val();
        var params = {'q': searchTerm, 'limit': 13};
        var url = "https://api.twitch.tv/kraken/search/" + searchType + "?";
/*===*/     if(searchType === "games") {
            url = "https://api.twitch.tv/kraken/search/games?type=suggest";
            var gamesSearch = new TwitchApiCall(searchType, searchTerm, params, url);
            var data = gamesSearch.apiCall();//How do i get response from api call here?=====
            console.log(data);//returns undefined================   /*===*/
        //will change these when above works=====================
        } else if (!searchType || searchType === "channels") {
            var defaultSearch = new TwitchApiCall(searchType, searchTerm, params, url);
            defaultSearch.apiCall();
            displaySearchResults(defaultSearch.response.channels);
        } else {
            var streamSearch = new TwitchApiCall(searchType, searchTerm, params, url);
            streamSearch.apiCall();
            displaySearchResults(streamSearch.response.streams);
        }
    });
}
function TwitchApiCall(searchType, searchTerm, params, url) {
    this.params = params;
    this.url = url;
    this.apiCall = function() {
        $.ajax({
            url: this.url,
            data: this.params,
/*===*/     success: function (response) {
                next = response._links.next;
                prev = response._links.prev;
                console.log(response);//returns the object i want==================
            }
        });        /*===*/
        $("#page-title").html("Twitch.tv/" + searchType + "/" + searchTerm);
        $("#sort-pop").addClass('active');
    };
}

Thanks in advance

问题的一部分是这个问题很可能不适合您正在尝试的OOP类型。或者至少没有什么理由把Twitch的东西做成一个对象。

这是未经测试的,但看起来它可能会这样做,并且是更干净的代码:

$("#search-btn").on('click', function(e) {
    e.preventDefault();
    searchTerm = $("#search-input").val();
    var params = {'q': searchTerm, 'limit': 13};
    var url = "https://api.twitch.tv/kraken/search/" + searchType + "?";
    if (searchType === "games") {
        url = "https://api.twitch.tv/kraken/search/games?type=suggest";
        callTwitch(searchType, searchTerm, params, url, function(data) {
            console.log(data);
        })
    } else if (!searchType || searchType === "channels") {
        callTwitch(searchType, searchTerm, params, url, function(data) {
            displaySearchResults(data.channels);
        });
    } else {
        callTwitch(searchType, searchTerm, params, url, function(data) {
            displaySearchResults(data.streams);
        });
    }
});

function callTwitch(searchType, searchTerm, params, url, callback) {
    $.ajax({
        url: url,
        data: params,
        success: function (response) {
            next = response._links.next;
            prev = response._links.prev;
            callback(response);
        }
    });
    $("#page-title").html("Twitch.tv/" + searchType + "/" + searchTerm);
    $("#sort-pop").addClass('active');
}

缺少错误处理。如果AJAX调用有错误的数据会发生什么?如果它不回来怎么办?但它应该能让你继续。