Remove duplicate array based on api response attribute value is something different than a normal array. In this post we will find out how we can achieve by comparing attribute value of object array and remove the duplicate array.<\/p>\n
In the below code what we are doing is, we loop through the original array and check with the ‘if’ condition se see if our blank new array doesn’t have any of original array. If that returns true then we are going to push original array to new array which is going to add only new numbers.<\/p>\n
Code<\/p>\n
\nvar originalArray = [2,6,6,9,9,8,8,8,7,4,2];\nvar newArray = [];\nfor (i=0; i<originalArray.length; i++) { \n if (!newArray.includes(originalArray[i])) {\n newArray.push(originalArray[i]); \n }\n}\nconsole.log(newArray); \/\/ [2,6,9,8,7,4];\n<\/code><\/pre>\nRemove duplicate array based on api response attribute value<\/h2>\n
Now what if you want to check that if the attribute value is duplicate. In the below response from API you can see that the attribute_value<\/code> has some duplicate number comparing to other arrays. <\/p>\nCode<\/p>\n
\n[\n {\n \"id\": \"484822\",\n \"activity_attributes\": [\n {\n \"id\": \"868117\",\n \"activity_id\": \"484822\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"1\",\n }\n ]\n },\n {\n \"id\": \"484884\",\n \"activity_attributes\": [\n {\n \"id\": \"868175\",\n \"activity_id\": \"484884\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"1\",\n }\n ]\n },\n {\n \"id\": \"484888\",\n \"activity_attributes\": [\n {\n \"id\": \"868182\",\n \"activity_id\": \"484888\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"1\",\n }\n ]\n },\n {\n \"id\": \"484823\",\n \"activity_attributes\": [\n {\n \"id\": \"868120\",\n \"activity_id\": \"484823\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"2\",\n }\n ]\n },\n {\n \"id\": \"484975\",\n \"activity_attributes\": [\n {\n \"id\": \"868344\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"2\",\n }\n ]\n },\n {\n \"id\": \"484891\",\n \"activity_attributes\": [\n {\n \"id\": \"868189\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"3\",\n }\n ]\n },\n {\n \"id\": \"484903\",\n \"activity_attributes\": [\n {\n \"id\": \"868200\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"4\",\n },\n ]\n }\n]\n<\/code><\/pre>\nIn order to remove duplicate array in such condition, we will perform to loop through an array. Then we will store its identifier by some function and then only return the first instance of each item.<\/p>\n
Code<\/p>\n
const filterByIteratee = (array, iteratee) => {\n\n \/\/ Empty object to store attributes as we encounter them\n const previousAttributeNames = {\n\n }\n\n return array.filter(item => {\n \/\/ Get the right value\n const itemValue = iteratee(item)\n\n \/\/ Check if we have already stored this item\n if (previousAttributeNames.hasOwnProperty(itemValue)) return false\n else {\n \/\/ Store the item so next time we encounter it we filter it out\n previousAttributeNames[itemValue] = true\n return true \n }\n })\n}<\/code><\/pre>\n<\/p>\nNow use the above function like below
\ncode
<\/code><\/p>\n\nconst uniqueLinks = filterByIteratee(social_post_link, item =>\n item.activity_attributes[0].attribute_value\n)\n<\/pre>\nNow the above code will return my desired output.<\/p>\n
Code<\/p>\n
\n [\n {\n \"id\": \"484822\",\n \"activity_attributes\": [\n {\n \"id\": \"868117\",\n \"activity_id\": \"484822\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"1\",\n }\n ]\n },\n {\n \"id\": \"484823\",\n \"activity_attributes\": [\n {\n \"id\": \"868120\",\n \"activity_id\": \"484823\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"2\",\n }\n ]\n },\n {\n \"id\": \"484891\",\n \"activity_attributes\": [\n {\n \"id\": \"868189\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"3\",\n }\n ]\n },\n {\n \"id\": \"484903\",\n \"activity_attributes\": [\n {\n \"id\": \"868200\",\n \"attribute_name\": \"position\",\n \"attribute_value\": \"4\",\n },\n ]\n }\n]\n<\/code><\/pre>\nNote: This might not be the best solution but it is very easy to understand. Reference link<\/a><\/p>\nHappy Learning.<\/p>\n
The post Remove duplicate array based on api response attribute value<\/a> appeared first on Santosh Shah<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Remove duplicate array based on api response attribute value is something different than a normal array. In this post we will find out how we can achieve by comparing attribute value of object array and remove the duplicate array. Remove duplicate array simple In the below code what we are doing is, we loop through […]<\/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":[],"class_list":["post-22","post","type-post","status-publish","format-standard","hentry","category-javascript"],"yoast_head":"\n
Remove duplicate array based on api response attribute value - Santosh Kumar Shah<\/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:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Remove duplicate array based on api response attribute value - Santosh Kumar Shah\" \/>\n<meta property=\"og:description\" content=\"Remove duplicate array based on api response attribute value is something different than a normal array. In this post we will find out how we can achieve by comparing attribute value of object array and remove the duplicate array. Remove duplicate array simple In the below code what we are doing is, we loop through […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/\" \/>\n<meta property=\"og:site_name\" content=\"Santosh Kumar Shah\" \/>\n<meta property=\"article:published_time\" content=\"2020-06-30T10:24:17+00:00\" \/>\n<meta name=\"author\" content=\"Santosh Kumar Shah\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Santosh Kumar Shah\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/\",\"url\":\"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/\",\"name\":\"Remove duplicate array based on api response attribute value - Santosh Kumar Shah\",\"isPartOf\":{\"@id\":\"https:\/\/santosh-shah.com\/blog\/#website\"},\"datePublished\":\"2020-06-30T10:24:17+00:00\",\"author\":{\"@id\":\"https:\/\/santosh-shah.com\/blog\/#\/schema\/person\/b17cb45bdd5f518e74a08ad2c6c4b39f\"},\"breadcrumb\":{\"@id\":\"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/santosh-shah.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Remove duplicate array based on api response attribute value\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/santosh-shah.com\/blog\/#website\",\"url\":\"https:\/\/santosh-shah.com\/blog\/\",\"name\":\"Santosh Kumar Shah\",\"description\":\"JavaScript Developer\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/santosh-shah.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/santosh-shah.com\/blog\/#\/schema\/person\/b17cb45bdd5f518e74a08ad2c6c4b39f\",\"name\":\"Santosh Kumar Shah\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/santosh-shah.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/cf46c57219d897547f3204b6b302169b3302b17507ccc902946b622a78d0b98b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/cf46c57219d897547f3204b6b302169b3302b17507ccc902946b622a78d0b98b?s=96&d=mm&r=g\",\"caption\":\"Santosh Kumar Shah\"},\"description\":\"I am JavaScript developer.\",\"sameAs\":[\"https:\/\/santosh-shah.com\/blog\"],\"url\":\"https:\/\/santosh-shah.com\/blog\/author\/sks7yu\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Remove duplicate array based on api response attribute value - Santosh Kumar Shah","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:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/","og_locale":"en_US","og_type":"article","og_title":"Remove duplicate array based on api response attribute value - Santosh Kumar Shah","og_description":"Remove duplicate array based on api response attribute value is something different than a normal array. In this post we will find out how we can achieve by comparing attribute value of object array and remove the duplicate array. Remove duplicate array simple In the below code what we are doing is, we loop through […]","og_url":"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/","og_site_name":"Santosh Kumar Shah","article_published_time":"2020-06-30T10:24:17+00:00","author":"Santosh Kumar Shah","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Santosh Kumar Shah","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/","url":"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/","name":"Remove duplicate array based on api response attribute value - Santosh Kumar Shah","isPartOf":{"@id":"https:\/\/santosh-shah.com\/blog\/#website"},"datePublished":"2020-06-30T10:24:17+00:00","author":{"@id":"https:\/\/santosh-shah.com\/blog\/#\/schema\/person\/b17cb45bdd5f518e74a08ad2c6c4b39f"},"breadcrumb":{"@id":"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/santosh-shah.com\/blog\/remove-duplicate-array-based-on-api-response-attribute-value\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/santosh-shah.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Remove duplicate array based on api response attribute value"}]},{"@type":"WebSite","@id":"https:\/\/santosh-shah.com\/blog\/#website","url":"https:\/\/santosh-shah.com\/blog\/","name":"Santosh Kumar Shah","description":"JavaScript Developer","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/santosh-shah.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/santosh-shah.com\/blog\/#\/schema\/person\/b17cb45bdd5f518e74a08ad2c6c4b39f","name":"Santosh Kumar Shah","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/santosh-shah.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/cf46c57219d897547f3204b6b302169b3302b17507ccc902946b622a78d0b98b?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/cf46c57219d897547f3204b6b302169b3302b17507ccc902946b622a78d0b98b?s=96&d=mm&r=g","caption":"Santosh Kumar Shah"},"description":"I am JavaScript developer.","sameAs":["https:\/\/santosh-shah.com\/blog"],"url":"https:\/\/santosh-shah.com\/blog\/author\/sks7yu\/"}]}},"_links":{"self":[{"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/posts\/22","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/comments?post=22"}],"version-history":[{"count":0,"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/posts\/22\/revisions"}],"wp:attachment":[{"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/media?parent=22"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/categories?post=22"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/santosh-shah.com\/blog\/wp-json\/wp\/v2\/tags?post=22"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}