{"id":604,"date":"2020-08-25T16:19:56","date_gmt":"2020-08-25T16:19:56","guid":{"rendered":"https:\/\/datatype.co.in\/blog\/?p=604"},"modified":"2020-08-26T09:47:19","modified_gmt":"2020-08-26T09:47:19","slug":"remove-duplicates-from-array-in-javascript","status":"publish","type":"post","link":"https:\/\/datatype.co.in\/blog\/remove-duplicates-from-array-in-javascript\/","title":{"rendered":"Remove Duplicates From Array in JavaScript"},"content":{"rendered":"\n<p>Here is a simple way to remove duplicate elements from an array in JavaScript. Just loop through the actual array and <a rel=\"noreferrer noopener\" aria-label=\" (opens in a new tab)\" href=\"https:\/\/datatype.co.in\/blog\/important-javascript-array-methods\/\" target=\"_blank\">push<\/a> each element in another temporary unique array. Before pushing an element into unique array,  make sure to check if the element already exist (in unique array). To learn more about how to check if a value exist in an array, you can read this article: <a href=\"https:\/\/datatype.co.in\/blog\/how-to-check-if-a-value-exists-in-an-array-in-javascript\/\" target=\"_blank\" rel=\"noopener noreferrer\">How to Check If a Value Exists in an Array in JavaScript<\/a><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>var fruits = [\"Apple\", \"Banana\", \"Mango\", \"Apple\", \"Papaya\"];\nvar unique = [];\n\nfruits.forEach(function(element){\n  \/\/ Push if the element does nor exist in unique array\n  if(unique.indexOf(element) === -1){\n    unique.push(element);\n  }\n})\n\nconsole.log(unique); \n\/\/ Output:\n[\"Apple\", \"Banana\", \"Mango\", \"Papaya\"]\n<\/code><\/pre>\n\n\n\n<p>This approach does not alter the order of elements. It will just eliminate duplicate values and keep the unique elements in the same order.<\/p>\n\n\n\n<p><strong>ES6 Approach: <\/strong><\/p>\n\n\n\n<p>Using ES6, you can get same result in just a single line of code as shown in the example below: <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>var fruits = [\"Apple\", \"Banana\", \"Mango\", \"Apple\", \"Papaya\"];\nvar unique = Array.from(new Set(fruits));\nconsole.log(unique); \n\/\/ Output:\n[\"Apple\", \"Banana\", \"Mango\", \"Papaya\"]<\/code><\/pre>\n\n\n\n<p>Please note that this code may not work in IE browser.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Here is a simple way to remove duplicate elements from an array in JavaScript. Just loop through the actual array and push each element in another temporary unique array. Before&nbsp;[ &hellip; ]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[202,201,176,100,203],"class_list":["post-604","post","type-post","status-publish","format-standard","hentry","category-javascript","tag-array","tag-eliminate-duplicates","tag-javascript","tag-js-interview-question","tag-unique-elements","list-style-post"],"_links":{"self":[{"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/posts\/604","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/comments?post=604"}],"version-history":[{"count":12,"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/posts\/604\/revisions"}],"predecessor-version":[{"id":616,"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/posts\/604\/revisions\/616"}],"wp:attachment":[{"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/media?parent=604"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/categories?post=604"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/datatype.co.in\/blog\/wp-json\/wp\/v2\/tags?post=604"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}