比较两个JSON数组并重新排列新的JSON数组格式

时间:2015-01-20 06:42:42

标签: javascript arrays json

这是我的第一个JSON数组格式......

[
    {
        "id": "1234",
        "caption": "caption1"
    },
    {
        "id": "2345",
        "caption": "caption2"
    },
    {
        "id": "3456",
        "caption": "caption3"
    }
]

这是另一种JSON数组格式

[
    [
        {
            "id": "1234",
            "value": "value11"
        },
        {
            "id": "2345",
            "value": "value12"
        },
        {
            "id": "3456",
            "value": "value13"
        }
    ],
    [
        {
            "id": "1234",
            "value": "value21"
        },
        {
            "id": "2345",
            "value": "value22"
        },
        {
            "id": "3456",
            "value": "value23"
        }
    ]
]

上面提到的两个JSON数组,我需要将每个数据与Id进行比较,并且需要使用javascript格式化带有标题和值的新JSON数组。

[
    [
        {
            "caption" : "caption1",
            "value":"value11"
        },
       {
            "caption" : "caption2",
            "value":"value12"
       },
       {
            "caption" : "caption3",
            "value":"value13"
       }
    ],
    [
       {
            "caption" : "caption1",
            "value":"value21"
       },
       {
           "caption" : "caption2",
           "value":"value22"
       },
       {
            "caption" : "caption3",
            "value":"value23"
       }
    ]
]

请帮帮我。

1 个答案:

答案 0 :(得分:1)

你可以通过多种方式实现这一目标。下面我展示了两个变种:

选项1:纯JavaScript

在这个例子中,程序preindex第一个数组用于更快地访问它的数据,然后用map()函数循环遍历第二个数组以创建新的数组数组:

// Create index version of first array
var aix = {};
for(var i=0;i<arr1.length;i++) {
    aix[arr1[i].id] = arr1[i].caption;
}

// Loop over array of arrays
var res1 = arr2.map(function(arr22){
    return arr22.map(function(a){
        return {caption:aix[a.id], value:a.value};
    }
});

选项2:使用特殊SQL库(Alasql)

在这里,您可以使用特殊的SQL语句自动加入数组:

var res2 = arr2.map(function(a){
    return alasql('SELECT arr1.caption, a.[value] \
                       FROM ? a JOIN ? arr1 USING id',[a,arr1]);
});

您可以在下面的工作代码段中尝试这些变体,或者使用它in jsFiddle

(免责声明:我是Alasql)的作者

&#13;
&#13;
var arr1 = [
    {
        "id": "1234",
        "caption": "caption1"
    },
    {
        "id": "2345",
        "caption": "caption2"
    },
    {
        "id": "3456",
        "caption": "caption3"
    }
];

var arr2 = [
    [
        {
            "id": "1234",
            "value": "value11"
        },
        {
            "id": "2345",
            "value": "value12"
        },
        {
            "id": "3456",
            "value": "value13"
        }
    ],
    [
        {
            "id": "1234",
            "value": "value21"
        },
        {
            "id": "2345",
            "value": "value22"
        },
        {
            "id": "3456",
            "value": "value23"
        }
    ]
];
// JavaScript version
var aix = {};
for(var i=0;i<arr1.length;i++) {
    aix[arr1[i].id] = arr1[i].caption;
}
var res1 = arr2.map(function(arr22){
    return arr22.map(function(a){
        return {caption:aix[a.id], value:a.value};
    });
});

document.getElementById("res1").textContent = JSON.stringify(res1);

// Alasql version
var res2 = arr2.map(function(a){
    return alasql('SELECT arr1.caption, a.[value] FROM ? a JOIN ? arr1 USING id',[a,arr1]);
});

document.getElementById("res2").textContent = JSON.stringify(res2);
&#13;
<script src="http://alasql.org/console/alasql.min.js"></script>

<p>Varian 1: JavaScript</p>
    <div id="res1"></div>
<p>Variant 2: Alasql</p>
<div id="res2"></div>
&#13;
&#13;
&#13;