jquery - 将两个 JQuery.Map 合并为一个？

Question

我正在对 Spotify 网络服务进行一些调用，以在我的个人应用程序中搜索艺术家和轨道。

问题是我想在一个对象中显示两个不同的结果。

这可能吗？

或者我应该以不同的方式处理？ (在这种情况下让我走上正轨)。

也许我应该对网络服务进行嵌套调用？(请编写一些代码，我自己尝试过，但我真的不知道如何正确执行)

Jsfiddle 的可读性和演示:http://jsfiddle.net/a97Ys/

下面的代码

function GetTracks(request, response) {
        $.get("http://ws.spotify.com/search/1/track.json", {
            q: request.term
        }, function (data) {
            response($.map(data.tracks.slice(0, 5), function (item) {
                return { label: item.name, by: item.artists[0].name, category: "Track" };
            }));
        });    
}

function GetArtist(request, response) {
    $.get("http://ws.spotify.com/search/1/artist.json", {
        q: request.term
    }, function (data) {
        response($.map(data.artists.slice(0, 5), function (item) {
            return { label: item.name, by: "", category: "Artist" };
        }));
    });
}

这个函数是我遇到问题的函数:

$(function () {
    $("#ListenToInput").catcomplete({
        delay: 0,
        source: function (request, response) {           
            //...Combine two maps and return one object ...//
        }
    });
});

Answer 1

当您使用自动完成功能时，最好保留一个本地缓存变量来存储结果。您可以使用相同的缓存来组合轨道和艺术家搜索结果，如下所示:

var cache = {};

function GetTracks(request, response) {
    $.get("http://ws.spotify.com/search/1/track.json", {
        q: request.term
    }, function (data) {
        $.merge(cache[request.term], 
        $.map(data.tracks.slice(0, 5), function (item) {
            return {
                label: item.name,
                by: item.artists[0].name,
                category: "Track"
            };
        }));
        response(cache[request.term]);
    });
}

function GetArtist(request, response) {
    $.get("http://ws.spotify.com/search/1/artist.json", {
        q: request.term
    }, function (data) {
        $.merge(cache[request.term], 
        $.map(data.artists.slice(0, 5), function (item) {
            return {
                label: item.name,
                by: "",
                category: "Artist"
            };
        }));
        response(cache[request.term]);
    });
}

$(function () {
    $("#ListenToInput").catcomplete({
        delay: 0,
        source: function (request, response) {
            if (cache[request.term]) {
                return response(cache[request.term]);
            } else {
                cache[request.term] = [];
                GetTracks(request, response);
                GetArtist(request, response);
            }
        }
    });
});

如果响应函数被调用两次，自动完成似乎不会提示。

http://jsfiddle.net/jk9s2/