{"id":15672,"date":"2022-10-12T13:05:57","date_gmt":"2022-10-12T07:35:57","guid":{"rendered":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/"},"modified":"2022-10-12T13:05:57","modified_gmt":"2022-10-12T07:35:57","slug":"solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects","status":"publish","type":"post","link":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/","title":{"rendered":"[Solved] Turning an object with arrays as properties into an array of objects"},"content":{"rendered":"<p> [ad_1]<br \/>\n<\/p>\n<div id=\"answer-60461447\" class=\"answer js-answer accepted-answer js-accepted-answer\" data-answerid=\"60461447\" data-parentid=\"60461297\" data-score=\"1\" data-position-on-page=\"1\" data-highest-scored=\"1\" data-question-has-accepted-highest-score=\"1\" itemprop=\"acceptedAnswer\" itemscope itemtype=\"https:\/\/schema.org\/Answer\">\n<div class=\"post-layout\">\n<div class=\"votecell post-layout--left\"><\/div>\n<div class=\"answercell post-layout--right\">\n<div class=\"s-prose js-post-body\" itemprop=\"text\">\n<p>You can transform your object around to get your desired result, first, transform your object to the following using <code>.map()<\/code> with <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Object\/entries\"><code>Object.entries()<\/code><\/a>:<\/p>\n<pre><code>[\n  [\n    {\n      \"service\": \"A\"\n    },\n    {\n      \"service\": \"B\"\n    }\n  ],\n  [\n    {\n      \"cost\": 20\n    },\n    {\n      \"cost\": 50\n    }\n  ]\n]\n<\/code><\/pre>\n<p>Next, zip these two inner arrays together (the first element of the first array gets grouped with the first element of the second array, the second element of the first array gets grouped with the second element of the second array), using <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Object\/assign\"><code>Object.assign()<\/code><\/a> as the grouping method:<\/p>\n<\/p>\n<div class=\"snippet\" data-lang=\"js\" data-hide=\"false\" data-console=\"true\" data-babel=\"false\">\n<div class=\"snippet-code\">\n<pre class=\"snippet-code-js lang-js prettyprint-override\"><code>const obj = {\"service\":[[\"A\"],[\"B\"]],\"cost\":[[20],[50]]};\nconst [first, ...r] = Object.entries(obj).map(([k,vals]) =&gt; vals.map(([v]) =&gt; ({[k]: v})));\nconst zipped = first.map((o, i) =&gt; Object.assign(o, ...r.map(arr =&gt; arr[i])));\n\nconsole.log(zipped);<\/code><\/pre>\n<\/div>\n<\/div>\n<p>We can take a similar approach using <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Object\/fromEntries\"><code>Object.fromEntries()<\/code><\/a>:<\/p>\n<\/p>\n<div class=\"snippet\" data-lang=\"js\" data-hide=\"false\" data-console=\"true\" data-babel=\"false\">\n<div class=\"snippet-code\">\n<pre class=\"snippet-code-js lang-js prettyprint-override\"><code>const obj = {\"service\":[[\"A\"],[\"B\"]],\"cost\":[[20],[50]]};\nconst [first, ...r] = Object.entries(obj).map(\n  ([k,vals]) =&gt; vals.map(([v]) =&gt; [k, v])\n);\nconst zipped = first.map((entry, i) =&gt; Object.fromEntries(\n  [entry, ...r.map(arr =&gt; arr[i])]\n));\nconsole.log(zipped);<\/code><\/pre>\n<\/div>\n<\/div><\/div>\n<div class=\"mt24\"><\/div>\n<\/div>\n<p>            <span class=\"d-none\" itemprop=\"commentCount\">3<\/span> <\/p><\/div>\n<\/div>\n<p>[ad_2]<\/p>\n<p>solved Turning an object with arrays as properties into an array of objects <\/p>\n","protected":false},"excerpt":{"rendered":"<p>[ad_1] You can transform your object around to get your desired result, first, transform your object to the following using .map() with Object.entries(): [ [ { &#8220;service&#8221;: &#8220;A&#8221; }, { &#8220;service&#8221;: &#8220;B&#8221; } ], [ { &#8220;cost&#8221;: 20 }, { &#8220;cost&#8221;: 50 } ] ] Next, zip these two inner arrays together (the first element &#8230; <a title=\"[Solved] Turning an object with arrays as properties into an array of objects\" class=\"read-more\" href=\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/\" aria-label=\"More on [Solved] Turning an object with arrays as properties into an array of objects\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[320],"tags":[361,333],"class_list":["post-15672","post","type-post","status-publish","format-standard","hentry","category-solved","tag-arrays","tag-javascript"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>[Solved] Turning an object with arrays as properties into an array of objects - JassWeb<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"[Solved] Turning an object with arrays as properties into an array of objects - JassWeb\" \/>\n<meta property=\"og:description\" content=\"[ad_1] You can transform your object around to get your desired result, first, transform your object to the following using .map() with Object.entries(): [ [ { &quot;service&quot;: &quot;A&quot; }, { &quot;service&quot;: &quot;B&quot; } ], [ { &quot;cost&quot;: 20 }, { &quot;cost&quot;: 50 } ] ] Next, zip these two inner arrays together (the first element ... Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/\" \/>\n<meta property=\"og:site_name\" content=\"JassWeb\" \/>\n<meta property=\"article:published_time\" content=\"2022-10-12T07:35:57+00:00\" \/>\n<meta name=\"author\" content=\"Kirat\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kirat\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/\"},\"author\":{\"name\":\"Kirat\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\"},\"headline\":\"[Solved] Turning an object with arrays as properties into an array of objects\",\"datePublished\":\"2022-10-12T07:35:57+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/\"},\"wordCount\":101,\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"keywords\":[\"arrays\",\"javascript\"],\"articleSection\":[\"Solved\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/\",\"url\":\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/\",\"name\":\"[Solved] Turning an object with arrays as properties into an array of objects - JassWeb\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#website\"},\"datePublished\":\"2022-10-12T07:35:57+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jassweb.com\/solved\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"[Solved] Turning an object with arrays as properties into an array of objects\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jassweb.com\/solved\/#website\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"name\":\"JassWeb\",\"description\":\"Build High-quality Websites\",\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jassweb.com\/solved\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\",\"name\":\"Jass Web\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"contentUrl\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"width\":693,\"height\":132,\"caption\":\"Jass Web\"},\"image\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\",\"name\":\"Kirat\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750\",\"contentUrl\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750\",\"caption\":\"Kirat\"},\"sameAs\":[\"http:\/\/jassweb.com\"],\"url\":\"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"[Solved] Turning an object with arrays as properties into an array of objects - JassWeb","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/","og_locale":"en_US","og_type":"article","og_title":"[Solved] Turning an object with arrays as properties into an array of objects - JassWeb","og_description":"[ad_1] You can transform your object around to get your desired result, first, transform your object to the following using .map() with Object.entries(): [ [ { \"service\": \"A\" }, { \"service\": \"B\" } ], [ { \"cost\": 20 }, { \"cost\": 50 } ] ] Next, zip these two inner arrays together (the first element ... Read more","og_url":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/","og_site_name":"JassWeb","article_published_time":"2022-10-12T07:35:57+00:00","author":"Kirat","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirat","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/#article","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/"},"author":{"name":"Kirat","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31"},"headline":"[Solved] Turning an object with arrays as properties into an array of objects","datePublished":"2022-10-12T07:35:57+00:00","mainEntityOfPage":{"@id":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/"},"wordCount":101,"publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"keywords":["arrays","javascript"],"articleSection":["Solved"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/","url":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/","name":"[Solved] Turning an object with arrays as properties into an array of objects - JassWeb","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/#website"},"datePublished":"2022-10-12T07:35:57+00:00","breadcrumb":{"@id":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jassweb.com\/solved\/solved-turning-an-object-with-arrays-as-properties-into-an-array-of-objects\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jassweb.com\/solved\/"},{"@type":"ListItem","position":2,"name":"[Solved] Turning an object with arrays as properties into an array of objects"}]},{"@type":"WebSite","@id":"https:\/\/jassweb.com\/solved\/#website","url":"https:\/\/jassweb.com\/solved\/","name":"JassWeb","description":"Build High-quality Websites","publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jassweb.com\/solved\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jassweb.com\/solved\/#organization","name":"Jass Web","url":"https:\/\/jassweb.com\/solved\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/","url":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","contentUrl":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","width":693,"height":132,"caption":"Jass Web"},"image":{"@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31","name":"Kirat","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/","url":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750","contentUrl":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750","caption":"Kirat"},"sameAs":["http:\/\/jassweb.com"],"url":"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/"}]}},"_links":{"self":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/15672","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/comments?post=15672"}],"version-history":[{"count":0,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/15672\/revisions"}],"wp:attachment":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/media?parent=15672"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/categories?post=15672"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/tags?post=15672"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}