将两个 JQuery.Map 合二为一？答案

【问题标题】：Combining Two JQuery.Map into one?将两个 JQuery.Map 合二为一？
【发布时间】：2013-09-03 19:00:40
【问题描述】：

我正在调用 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 ...//
        }
    });
});

【问题讨论】：

标签： jquery json jquery-ui merge

【解决方案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/

【讨论】：