{"id":1163,"date":"2022-08-30T15:13:26","date_gmt":"2022-08-30T15:13:26","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2013\/11\/09\/convert-one-javascript-nested-object-data-structure-to-nested-arrays-collection-of-common-programming-errors\/"},"modified":"2022-08-30T15:13:26","modified_gmt":"2022-08-30T15:13:26","slug":"convert-one-javascript-nested-object-data-structure-to-nested-arrays-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2022\/08\/30\/convert-one-javascript-nested-object-data-structure-to-nested-arrays-collection-of-common-programming-errors\/","title":{"rendered":"Convert one javascript nested object data structure to nested arrays-Collection of common programming errors"},"content":{"rendered":"

I am trying to convert a JSON string in a Javascript object literal. I think it is possible with some loops, but i couldn’t get it done. The target structure is shown below, “chartData”.<\/p>\n

Fiddle can be found here: http:\/\/jsbin.com\/ajemih\/13\/edit<\/p>\n

Here’s the JSON data:<\/p>\n

{\n   \"1b\":{\n      \"allLoad\":\"130\",\n      \"loadMovement\":\"111\",\n      \"allMovement\":\"111\"\n   },\n   \"1a\":{\n      \"allLoad\":\"910\",\n      \"loadMovement\":\"671\",\n      \"allMovement\":\"280\"\n   },\n   \"systemLoad\":\"963\"\n}\n<\/code><\/pre>\n
This should it look like after the conversion:<\/p>\n
chartData = [[['loadMovement', 111], \n              ['allMovement', 120], \n              ['allLoad', 130]], \n             [['Load+Move', 671], \n              ['allMovement', 280], \n              ['allLoad', 910]]];\n<\/code><\/pre>\n
    \n
  1. \n
    I think this would work:<\/p>\n
    Working demo: http:\/\/jsfiddle.net\/jfriend00\/YmjDR\/<\/p>\n
    var data = {\n   \"1b\":{\n      \"allLoad\":\"130\",\n      \"loadMovement\":\"111\",\n      \"allMovement\":\"111\"\n   },\n   \"1a\":{\n      \"allLoad\":\"910\",\n      \"loadMovement\":\"671\",\n      \"allMovement\":\"280\"\n   },\n   \"systemLoad\":\"963\"\n};\n\nvar chartData = [];\n\nfor (var i in data) {\n    var item = data[i];\n    var outer = [];\n    \/\/ skip over items in the outer object that aren't nested objects themselves\n    if (typeof item === \"object\") {\n        for (var j in item) {\n            var temp = [];\n            temp.push(j);\n            temp.push(item[j]);\n            outer.push(temp);\n        }\n    }\n    if (outer.length) {\n        chartData.push(outer);\n    }\n}\n<\/code><\/pre>\n<\/li>\n
  2. \n
    You could do something like this:<\/p>\n
    var chartData = []\n\nfor(var key in data) {        \n    var properties = data[key];\n\n    if(typeof properties === \"object\") {\n       var array = [];\n\n       for(var propKey in properties) {\n           array.push([propKey, properties[propKey]])\n       }\n\n       chartData.push(array);\n    }             \n}\n<\/code><\/pre>\n
    Check out the fiddle.<\/p>\n<\/li>\n
  3. \n
    You need to map the data manually. Thats actually more a diligent but routine piece of work.<\/p>\n
    var jsonData = 'your json string';\n\nObject.keys( jsonData ).map(function( key ) {\n    if( typeof jsonData[ key ] === 'object' ) {\n        return Object.keys( jsonData[ key ] ).sort(function( a, b ) {\n            return +jsonData[ key ][ a ] - +jsonData[ key ][ b ];\n        }).map(function( name ) {\n            return [ name, jsonData[ key ][ name ] ];\n        });\n    }\n}).filter( Boolean );\n<\/code><\/pre>\n
    The above code will sort each group by its numeric value and then map a new array in the required style. Since .map()<\/code> possibly returns undefined<\/code> values on non-object elements, we need to filter those out before or afterwards.<\/p>\n
    See http:\/\/jsfiddle.net\/WjZB2\/2\/<\/p>\n<\/li>\n<\/ol>\n
    Originally posted 2013-11-09 23:33:40. <\/small><\/p>","protected":false},"excerpt":{"rendered":"
    I am trying to convert a JSON string in a Javascript object literal. I think it is possible with some loops, but i couldn’t get it done. The target structure is shown below, “chartData”. Fiddle can be found here: http:\/\/jsbin.com\/ajemih\/13\/edit Here’s the JSON data: { “1b”:{ “allLoad”:”130″, “loadMovement”:”111″, “allMovement”:”111″ }, “1a”:{ “allLoad”:”910″, “loadMovement”:”671″, “allMovement”:”280″ }, […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1163","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1163","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=1163"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1163\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=1163"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=1163"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=1163"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}