javascript - 按整数排序 JSON 变量中的结果

Question

我正在构建一个基于两个 Google API 的 jQuery 搜索建议脚本。每个 API 输出一个“相关性”整数(我将在每个项目旁边返回以进行演示)并且我希望能够按每个项目的该整数对结果进行排序。

我该怎么做？我试着让脚本将所有内容输出到一个变量中，但我无法完全解决。

可在此处查看工作演示:http://jsfiddle.net/rEPf3/

我的 jQuery 代码是:

$(document).ready(function(){
    $("#search").keyup(function(){
        $.getJSON("http://suggestqueries.google.com/complete/search?q="+$("#search").val()+"&client=chrome&callback=?",function(data){
            var suggestion="";
            for(var key in data[1]){
                if(data[4]["google:suggesttype"][key]=="NAVIGATION"){
                suggestion+="<li><a href='"+data[1][key]+"'>"+data[2][key]+"</a> <i>("+data[4]["google:suggestrelevance"][key]+")</i></li>";
                }else{
                suggestion+="<li>"+data[1][key]+" <i>("+data[4]["google:suggestrelevance"][key]+")</i></li>";
                }
            }
            $("#suggest").html(suggestion);
        });
        $.getJSON("https://www.googleapis.com/freebase/v1/search?query="+$("#search").val()+"&limit=3&encode=html&callback=?",function(data){
            var suggestion2="";
            for(var key in data.result){
                suggestion2+="<li>"+data.result[key].name+" <i>("+data.result[key].score*4+")</i></li>";
            }
            $("#suggest2").html(suggestion2);
        });
    });
});

Answer 1

我认为最简洁的方法是将每个数据集的结果推送到一个外部范围的变量中，然后从中排序和渲染。示例如下。

var combined = [],
    completed = 0;

$(document).ready(function () {
    $("#search").keyup(function () {
        combined = [];
        completed = 0;
        $.getJSON("http://suggestqueries.google.com/complete/search?q=" + $("#search").val() + "&client=chrome&callback=?", function (data) {
            for (var key in data[1]) {
                if (data[4]["google:suggesttype"][key] == "NAVIGATION") {
                    combined.push({
                        href : data[1][key],
                        text : data[2][key],
                        score : parseInt(data[4]["google:suggestrelevance"][key],10)
                    });
                } else {
                    combined.push({
                        text : data[1][key],
                        score : parseInt(data[4]["google:suggestrelevance"][key],10)
                    });
                }
            }
            if ( ++completed == 2 ) complete();
        });
        $.getJSON("https://www.googleapis.com/freebase/v1/search?query=" + $("#search").val() + "&limit=3&encode=html&callback=?", function (data) {
            for (var key in data.result) {
                combined.push({
                    text : data.result[key].name,
                    score : parseInt(data.result[key].score,10) * 14
                });
            }
            if ( ++completed == 2 ) complete();
        });
    });
});


function complete(){
    console.log(combined);
    combined.sort(function(a,b){ return b.score - a.score; });
    var buffer = [];
    combined.forEach(function(result){
        buffer.push("<li>"+result.text+" <i>("+result.score+")</i></li>")
    })
    $("#suggest").html(buffer.join(""));
}

编辑

这个解决方案没有考虑到用户输入的速度可能比 API 快，API 调用可能不会按顺序返回，也没有采取任何措施来限制对每个 API 的调用。为了使它的行为更一致(更有效):

• 更改按键处理程序，以便每次按键都取消之前的任何超时，然后以合理的延迟设置新的超时(300 毫秒似乎是一个合理的起点)，然后触发 API 调用
• 将每个 API 调用包装在一个立即执行的函数中，以便您可以在进行每个 API 调用时引用全局计数器的值。每次按键时增加计数器，并且不处理计数器不匹配的 API 调用的响应