{"id":22346,"date":"2024-03-15T23:25:47","date_gmt":"2024-03-15T23:25:47","guid":{"rendered":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/"},"modified":"2024-03-21T22:39:38","modified_gmt":"2024-03-21T22:39:38","slug":"how-to-automatically-remove-duplicates-from-an-es6-array","status":"publish","type":"post","link":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/","title":{"rendered":"How to automatically remove duplicates from an ES6 array?"},"content":{"rendered":"

In ES6, you can use the Set data structure to automatically remove duplicates from an array. Set is a data structure similar to an array that can store unique values of any type.<\/p>\n

You can achieve automatic deduplication of an array by following these steps:<\/p>\n

    \n
  1. Create a new set called uniqueSet.<\/li>\n
  2. Loop through the array and for each item add it to a set called uniqueSet.<\/li>\n
  3. Create a unique array by converting a unique set into an array.<\/li>\n<\/ol>\n

    The complete code example is as follows:<\/p>\n

    const<\/span> array = [1<\/span>, 2<\/span>, 3<\/span>, 4<\/span>, 4<\/span>, 5<\/span>, 5<\/span>, 6<\/span>];\r\nconst<\/span> uniqueSet = new<\/span> Set<\/span>();\r\narray.forEach<\/span>(item<\/span> =><\/span> uniqueSet.add<\/span>(item));\r\nconst<\/span> uniqueArray = Array<\/span>.from<\/span>(uniqueSet);\r\nconsole<\/span>.log<\/span>(uniqueArray); \/\/ \u8f93\u51fa\uff1a[1, 2, 3, 4, 5, 6]<\/span>\r\n<\/code><\/pre>\n
    Furthermore, ES6 also offers a more concise way to automatically remove duplicates from an array, using the spread operator as shown below:<\/p>\n
    const<\/span> array = [1<\/span>, 2<\/span>, 3<\/span>, 4<\/span>, 4<\/span>, 5<\/span>, 5<\/span>, 6<\/span>];\r\nconst<\/span> uniqueArray = [...new<\/span> Set<\/span>(array)];\r\nconsole<\/span>.log<\/span>(uniqueArray); \/\/ \u8f93\u51fa\uff1a[1, 2, 3, 4, 5, 6]<\/span>\r\n<\/code><\/pre>\n
    Using the Set data structure can easily achieve automatic deduplication of arrays, but it should be noted that the values stored in the Set are unique, and their data types will not undergo implicit conversion. So if there are values in the array that are both strings and numbers similar, they will still be treated as different values.<\/p>\n","protected":false},"excerpt":{"rendered":"
    In ES6, you can use the Set data structure to automatically remove duplicates from an array. Set is a data structure similar to an array that can store unique values of any type. You can achieve automatic deduplication of an array by following these steps: Create a new set called uniqueSet. Loop through the array […]<\/p>\n","protected":false},"author":7,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":"","footnotes":""},"categories":[1],"tags":[],"class_list":["post-22346","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"\nHow to automatically remove duplicates from an ES6 array? - Blog - Silicon Cloud<\/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:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to automatically remove duplicates from an ES6 array?\" \/>\n<meta property=\"og:description\" content=\"In ES6, you can use the Set data structure to automatically remove duplicates from an array. Set is a data structure similar to an array that can store unique values of any type. You can achieve automatic deduplication of an array by following these steps: Create a new set called uniqueSet. Loop through the array […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog - Silicon Cloud\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/SiliCloudGlobal\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-03-15T23:25:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-03-21T22:39:38+00:00\" \/>\n<meta name=\"author\" content=\"Sophia Anderson\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@SiliCloudGlobal\" \/>\n<meta name=\"twitter:site\" content=\"@SiliCloudGlobal\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sophia Anderson\" \/>\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:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/\"},\"author\":{\"name\":\"Sophia Anderson\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/19a24313de9c988db3d69226b4a40a30\"},\"headline\":\"How to automatically remove duplicates from an ES6 array?\",\"datePublished\":\"2024-03-15T23:25:47+00:00\",\"dateModified\":\"2024-03-21T22:39:38+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/\"},\"wordCount\":174,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/#organization\"},\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/\",\"url\":\"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/\",\"name\":\"How to automatically remove duplicates from an ES6 array? - Blog - Silicon Cloud\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/#website\"},\"datePublished\":\"2024-03-15T23:25:47+00:00\",\"dateModified\":\"2024-03-21T22:39:38+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.silicloud.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to automatically remove duplicates from an ES6 array?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#website\",\"url\":\"https:\/\/www.silicloud.com\/blog\/\",\"name\":\"Silicon Cloud Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/#organization\"},\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#organization\",\"name\":\"Silicon Cloud Blog\",\"url\":\"https:\/\/www.silicloud.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.silicloud.com\/blog\/wp-content\/uploads\/2023\/11\/EN-SILICON-Full.png\",\"contentUrl\":\"https:\/\/www.silicloud.com\/blog\/wp-content\/uploads\/2023\/11\/EN-SILICON-Full.png\",\"width\":1024,\"height\":1024,\"caption\":\"Silicon Cloud Blog\"},\"image\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/SiliCloudGlobal\/\",\"https:\/\/twitter.com\/SiliCloudGlobal\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/19a24313de9c988db3d69226b4a40a30\",\"name\":\"Sophia Anderson\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c726c09aa40e37115fb5c62d0c3ed62c16ca255d3763e2e3ae83a70ddf8c2175?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c726c09aa40e37115fb5c62d0c3ed62c16ca255d3763e2e3ae83a70ddf8c2175?s=96&d=mm&r=g\",\"caption\":\"Sophia Anderson\"},\"url\":\"https:\/\/www.silicloud.com\/blog\/author\/sophiaanderson\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to automatically remove duplicates from an ES6 array? - Blog - Silicon Cloud","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:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/","og_locale":"en_US","og_type":"article","og_title":"How to automatically remove duplicates from an ES6 array?","og_description":"In ES6, you can use the Set data structure to automatically remove duplicates from an array. Set is a data structure similar to an array that can store unique values of any type. You can achieve automatic deduplication of an array by following these steps: Create a new set called uniqueSet. Loop through the array […]","og_url":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/","og_site_name":"Blog - Silicon Cloud","article_publisher":"https:\/\/www.facebook.com\/SiliCloudGlobal\/","article_published_time":"2024-03-15T23:25:47+00:00","article_modified_time":"2024-03-21T22:39:38+00:00","author":"Sophia Anderson","twitter_card":"summary_large_image","twitter_creator":"@SiliCloudGlobal","twitter_site":"@SiliCloudGlobal","twitter_misc":{"Written by":"Sophia Anderson","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/#article","isPartOf":{"@id":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/"},"author":{"name":"Sophia Anderson","@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/19a24313de9c988db3d69226b4a40a30"},"headline":"How to automatically remove duplicates from an ES6 array?","datePublished":"2024-03-15T23:25:47+00:00","dateModified":"2024-03-21T22:39:38+00:00","mainEntityOfPage":{"@id":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/"},"wordCount":174,"commentCount":0,"publisher":{"@id":"https:\/\/www.silicloud.com\/blog\/#organization"},"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/","url":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/","name":"How to automatically remove duplicates from an ES6 array? - Blog - Silicon Cloud","isPartOf":{"@id":"https:\/\/www.silicloud.com\/blog\/#website"},"datePublished":"2024-03-15T23:25:47+00:00","dateModified":"2024-03-21T22:39:38+00:00","breadcrumb":{"@id":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.silicloud.com\/blog\/how-to-automatically-remove-duplicates-from-an-es6-array\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.silicloud.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to automatically remove duplicates from an ES6 array?"}]},{"@type":"WebSite","@id":"https:\/\/www.silicloud.com\/blog\/#website","url":"https:\/\/www.silicloud.com\/blog\/","name":"Silicon Cloud Blog","description":"","publisher":{"@id":"https:\/\/www.silicloud.com\/blog\/#organization"},"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.silicloud.com\/blog\/#organization","name":"Silicon Cloud Blog","url":"https:\/\/www.silicloud.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.silicloud.com\/blog\/wp-content\/uploads\/2023\/11\/EN-SILICON-Full.png","contentUrl":"https:\/\/www.silicloud.com\/blog\/wp-content\/uploads\/2023\/11\/EN-SILICON-Full.png","width":1024,"height":1024,"caption":"Silicon Cloud Blog"},"image":{"@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/SiliCloudGlobal\/","https:\/\/twitter.com\/SiliCloudGlobal"]},{"@type":"Person","@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/19a24313de9c988db3d69226b4a40a30","name":"Sophia Anderson","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/c726c09aa40e37115fb5c62d0c3ed62c16ca255d3763e2e3ae83a70ddf8c2175?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c726c09aa40e37115fb5c62d0c3ed62c16ca255d3763e2e3ae83a70ddf8c2175?s=96&d=mm&r=g","caption":"Sophia Anderson"},"url":"https:\/\/www.silicloud.com\/blog\/author\/sophiaanderson\/"}]}},"_links":{"self":[{"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/posts\/22346","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/comments?post=22346"}],"version-history":[{"count":1,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/posts\/22346\/revisions"}],"predecessor-version":[{"id":56263,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/posts\/22346\/revisions\/56263"}],"wp:attachment":[{"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/media?parent=22346"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/categories?post=22346"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/tags?post=22346"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}