{"id":1147,"date":"2017-04-10T09:27:36","date_gmt":"2017-04-10T16:27:36","guid":{"rendered":"http:\/\/somethingk.com\/main\/?p=1147"},"modified":"2017-04-10T09:27:36","modified_gmt":"2017-04-10T16:27:36","slug":"reordering-an-array-based-on-another-arrays-order-in-javascript","status":"publish","type":"post","link":"https:\/\/somethingk.com\/main\/reordering-an-array-based-on-another-arrays-order-in-javascript\/","title":{"rendered":"Reordering an Array Based on Another Array&#8217;s Order in Javascript"},"content":{"rendered":"<section id=\"text-4\" class=\"widget boka-widget widget_text amr_widget\">\t\t\t<div class=\"textwidget\"><script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script>\r\n<ins class=\"adsbygoogle\"\r\n     style=\"display:block; text-align:center;\"\r\n     data-ad-layout=\"in-article\"\r\n     data-ad-format=\"fluid\"\r\n     data-ad-client=\"ca-pub-7619916617995509\"\r\n     data-ad-slot=\"9102150708\"><\/ins>\r\n<script>\r\n     (adsbygoogle = window.adsbygoogle || []).push({});\r\n<\/script><\/div>\n\t\t<\/section>\n<p>So I had a problem, awhile ago, where I needed to reorder elements in an array based off of the order of another array. So I basically had to capture the order from one and apply it to another. In my case, both arrays had a common id field. However, with the model I have here, I was able to order additional arrays without the id field, if I needed to, which I did \ud83d\ude42<\/p>\n<p>Below is my code solution.<\/p>\n<div class=\"snippetcpt-wrap\" id=\"snippet-1148\" data-id=\"1148\" data-edit=\"\" data-copy=\"\/main\/wp-json\/wp\/v2\/posts\/1147?snippet=c3714dc077&#038;id=1148\" data-fullscreen=\"https:\/\/somethingk.com\/main\/code-snippets\/reordering-an-array-based-on-another-arrays-order-in-javascript\/?full-screen=1\">\n\t\t\t\t<pre class=\"prettyprint linenums lang-javascript\" title=\"Reordering an Array Based on Another Array&#039;s Order in Javascript\">function getNewOrder() {\r\n    \/\/Get an identifier from the array you want to base the order on\r\n    const newIds = newArrayOrder.map(x =&gt; x.id);\r\n    \r\n    \/\/Get an identifier from the array you want to update\r\n    const ids = arrayToOrder.map(x =&gt; x.id);\r\n    \r\n    \/\/placeholder for order\r\n    const order = [];\r\n    \r\n    \/\/loop through the ids, pushing the arrayToOrder's index of the new order ids\r\n    \/\/We end up with an array of indexes\r\n    for(let i = 0; i &lt; ids.length; i++) {\r\n      order.push(ids.indexOf(newIds[i]));\r\n    }\r\n    \r\n    \/\/reorder the array\r\n    reorderIds(order, arrayToOrder);\r\n}\r\n\r\n\/\/Preform the reordering\r\nfunction reorderIds(order, arrayToOrder){\r\n    \/\/Get a copy of the array we want to change\r\n    const temp = arrayToOrder.slice(0);\r\n    \r\n    \/\/loop through the indexes\r\n    \/\/use the indexes to place the items in the right place from the copy into the original\r\n    for(let i = 0; i &lt; arrayToOrder.length; i++) {\r\n      arrayToOrder[order[i]] = temp[i];\r\n    }\r\n}<\/pre>\n\t\t\t<\/div>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>So I had a problem, awhile ago, where I needed to reorder elements in an array based off of the order of another array. So I basically had to capture the order from one and apply it to another. In my case, both arrays had a common id field. However, with the model I have here, I was able to [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[177],"tags":[489,323,634,633],"class_list":["post-1147","post","type-post","status-publish","format-standard","hentry","category-development","tag-array","tag-javascript","tag-order","tag-reordering"],"_links":{"self":[{"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/posts\/1147","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/comments?post=1147"}],"version-history":[{"count":1,"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/posts\/1147\/revisions"}],"predecessor-version":[{"id":1149,"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/posts\/1147\/revisions\/1149"}],"wp:attachment":[{"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/media?parent=1147"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/categories?post=1147"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/somethingk.com\/main\/wp-json\/wp\/v2\/tags?post=1147"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}