将json响应变为javascript数组

时间:2022-01-23 21:15:57

If I have the following function that iterates through a json response object (val2):

如果我有以下函数迭代json响应对象(val2):

function test(val2){

    jQuery.each(val2.maps, function(j, val3) {    

        maps = new Array({

            id: val2.maps[j].id,
            parent: val2.maps[j].parent,
            image: val2.maps[j].image,
            data: val2.maps[j].data,
            width: val2.maps[j].width,
            height: val2.maps[j].height,
            top: val2.maps[j].top,
            left: val2.maps[j].left                         
        })

    });

return maps
}

how do I get it into an array that resembles the following format? Currently I'm only getting back the last array item.

如何将其添加到类似于以下格式的数组中?目前我只回到最后一个数组项目。

maps = [{
    id: 'south',
    parent: 'us',
    image: '/resources/images/maps/map_south.jpg',
    data: 'popups/region_south.html',
    width: '227px',
    height: '177px',
    top: '120px',
    left: '49px'
},
{
    id: 'east',
    parent: 'us',
    image: '/resources/images/maps/map_east.jpg',
    data: 'popups/region_east.html',
    width: '156px',
    height: '121px',
    top: '120px',
    left: '283px'
}]

Cheers

3 个解决方案

#1


1  

Always fun when people post answers without explaining anything it seems to me that you don't actually know what you're doing here, so let me explain:

当人们发布答案而不解释任何我认为你实际上并不知道你在这里做什么的时候总是很有趣,所以让我解释一下:

function test(val2){

    // use jQuery.each to apply a function to each element in val2.maps
    jQuery.each(val2.maps, function(j, val3) {    

        // here you create a new global variable called 'maps' and assign and Array to it
        // the constructor 'new Array' is given one argument here
        // which is the object in which you map the values
        // notice: you're always creating a new array with only ONE element
        //         therefore you never fill it up
        maps = new Array({

            // Instead of 'val2.maps[j].id', you could simply do 'val3.id' etc.
            // Since val3 already contains 'val2.maps[j]'
            id: val2.maps[j].id,
            parent: val2.maps[j].parent,
            image: val2.maps[j].image,
            data: val2.maps[j].data,
            width: val2.maps[j].width,
            height: val2.maps[j].height,
            top: val2.maps[j].top,
            left: val2.maps[j].left                         
        }) // missing semicolon here btw ;)

    });

    // this returns the last Array that was created
    return maps
}

Here's a fixed version, which actually does populate the array properly:

这是一个固定版本,它实际上正确地填充了数组:

function test(val2){
    var maps = []; // create an array that's local to this function, so it does not override any global stuff
    jQuery.each(val2.maps, function(j, val3) {    

        // append a new element to the array, this time directly use 'val3'
        maps.push({
            id: val3.id,
            parent: val3.parent,
            image: val3.image,
            data: val3.data,
            width: val3.width,
            height: val3.height,
            top: val3.top,
            left: val3.left                         
        });
    });

    // this time return the array with all the elements
    return maps
}

Also all your code has basically no effect, since all you're doing is copying the elements of one array into another one without changing the structure in any way.

此外,您的所有代码基本上都没有效果,因为您所做的只是将一个数组的元素复制到另一个数组而不以任何方式更改结构。

So in the end the values in both val2.maps and your returned maps are "identical", only difference is that they do not point to the same objects since you copied all the values into new ones.

因此,最后val2.maps和返回的映射中的值都是“相同的”,唯一的区别是它们没有指向相同的对象,因为您将所有值复制到新的值。

If you don't need a copy or you want to keep the reference to the original values, this would do it:

如果您不需要副本,或者希望保留对原始值的引用,则可以执行以下操作:

function test(val2) {
    return val2.maps; // return the reference to maps
}

Nick has shown an even fancier version of doing the whole copying thing, but I thought it might help you more if someone would actually point out your mistakes, rather then posting even "crazier" jQuery code for you to copy&paste ;)

尼克已经展示了一个更复杂的版本来做整个复制的事情,但我认为它可能会帮助你更多,如果有人实际上指出你的错误,而不是发布甚至“疯狂”的jQuery代码供你复制和粘贴;)

PS: Love my Firefox, Session just crashed but my answer was still here after the restart ^_^"

PS:喜欢我的Firefox,Session刚刚崩溃,但重启后我的答案还在这里^ _ ^“

#2


0  

Something like this should do:

这样的事应该做​​:

var result = [];
jQuery.each(val2.maps, function(j, val3) {    
    maps = result.push({
        id: val2.maps[j].id,
        ...
    });
});

#3


0  

You can use jQuery.map(), like this:

您可以使用jQuery.map(),如下所示:

function test(val2){
  return jQuery.map(val2.maps, function() {    
    return {
             id: this.id,
             parent: this.parent,
             image: this.image,
             data: this.data,
             width: this.width,
             height: this.height,
             top: this.top,
             left: this.left                         
           };
  }).get();
}

Though, given the format, it seems like val2.maps is already the collection you're after, can you not use it directly?

虽然,鉴于格式,似乎val2.maps已经是你所追求的集合,你能不能直接使用它?

#1


1  

Always fun when people post answers without explaining anything it seems to me that you don't actually know what you're doing here, so let me explain:

当人们发布答案而不解释任何我认为你实际上并不知道你在这里做什么的时候总是很有趣,所以让我解释一下:

function test(val2){

    // use jQuery.each to apply a function to each element in val2.maps
    jQuery.each(val2.maps, function(j, val3) {    

        // here you create a new global variable called 'maps' and assign and Array to it
        // the constructor 'new Array' is given one argument here
        // which is the object in which you map the values
        // notice: you're always creating a new array with only ONE element
        //         therefore you never fill it up
        maps = new Array({

            // Instead of 'val2.maps[j].id', you could simply do 'val3.id' etc.
            // Since val3 already contains 'val2.maps[j]'
            id: val2.maps[j].id,
            parent: val2.maps[j].parent,
            image: val2.maps[j].image,
            data: val2.maps[j].data,
            width: val2.maps[j].width,
            height: val2.maps[j].height,
            top: val2.maps[j].top,
            left: val2.maps[j].left                         
        }) // missing semicolon here btw ;)

    });

    // this returns the last Array that was created
    return maps
}

Here's a fixed version, which actually does populate the array properly:

这是一个固定版本,它实际上正确地填充了数组:

function test(val2){
    var maps = []; // create an array that's local to this function, so it does not override any global stuff
    jQuery.each(val2.maps, function(j, val3) {    

        // append a new element to the array, this time directly use 'val3'
        maps.push({
            id: val3.id,
            parent: val3.parent,
            image: val3.image,
            data: val3.data,
            width: val3.width,
            height: val3.height,
            top: val3.top,
            left: val3.left                         
        });
    });

    // this time return the array with all the elements
    return maps
}

Also all your code has basically no effect, since all you're doing is copying the elements of one array into another one without changing the structure in any way.

此外,您的所有代码基本上都没有效果,因为您所做的只是将一个数组的元素复制到另一个数组而不以任何方式更改结构。

So in the end the values in both val2.maps and your returned maps are "identical", only difference is that they do not point to the same objects since you copied all the values into new ones.

因此,最后val2.maps和返回的映射中的值都是“相同的”,唯一的区别是它们没有指向相同的对象,因为您将所有值复制到新的值。

If you don't need a copy or you want to keep the reference to the original values, this would do it:

如果您不需要副本,或者希望保留对原始值的引用,则可以执行以下操作:

function test(val2) {
    return val2.maps; // return the reference to maps
}

Nick has shown an even fancier version of doing the whole copying thing, but I thought it might help you more if someone would actually point out your mistakes, rather then posting even "crazier" jQuery code for you to copy&paste ;)

尼克已经展示了一个更复杂的版本来做整个复制的事情,但我认为它可能会帮助你更多,如果有人实际上指出你的错误,而不是发布甚至“疯狂”的jQuery代码供你复制和粘贴;)

PS: Love my Firefox, Session just crashed but my answer was still here after the restart ^_^"

PS:喜欢我的Firefox,Session刚刚崩溃,但重启后我的答案还在这里^ _ ^“

#2


0  

Something like this should do:

这样的事应该做​​:

var result = [];
jQuery.each(val2.maps, function(j, val3) {    
    maps = result.push({
        id: val2.maps[j].id,
        ...
    });
});

#3


0  

You can use jQuery.map(), like this:

您可以使用jQuery.map(),如下所示:

function test(val2){
  return jQuery.map(val2.maps, function() {    
    return {
             id: this.id,
             parent: this.parent,
             image: this.image,
             data: this.data,
             width: this.width,
             height: this.height,
             top: this.top,
             left: this.left                         
           };
  }).get();
}

Though, given the format, it seems like val2.maps is already the collection you're after, can you not use it directly?

虽然,鉴于格式,似乎val2.maps已经是你所追求的集合,你能不能直接使用它?