Created
July 3, 2021 09:52
-
-
Save Yagisanatode/b2e6133013703e8158f52d63a0a33bea to your computer and use it in GitHub Desktop.
Get a Unique List of Objects in an Array of Object in JavaScript
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Check out the link for the full tutorial and video guide | |
* {@link https://yagisanatode.com/2021/07/03/get-a-unique-list-of-objects-in-an-array-of-object-in-javascript/ |Get a Unique List of Objects in an Array of Object in JavaScript} | |
*/ | |
const myObjArray = [ | |
{ | |
name: "Eva Devore", | |
character: "Evandra", | |
episodes: 15, | |
}, | |
{ | |
name: "Alessia Medina", | |
character: "Nixie", | |
episodes: 15, | |
}, | |
{ | |
name: "Kendall Drury", | |
character: "DM", | |
episodes: 15, | |
}, | |
{ | |
name: "Thomas Taufan", | |
character: "Antrius", | |
episodes: 14, | |
}, | |
{ | |
name: "Alessia Medina", | |
character: "Nixie", | |
episodes: 15, | |
}, | |
]; | |
// Creates an array of objects with unique "name" property values. | |
let uniqueObjArray = [ | |
...new Map(myObjArray.map((item) => [item["name"], item])).values(), | |
]; | |
console.log("uniqueObjArray", uniqueObjArray); | |
// LOGS: | |
// uniqueObjArray [ | |
// { name: 'Eva Devore', character: 'Evandra', episodes: 15 }, | |
// { name: 'Alessia Medina', character: 'Nixie', episodes: 15 }, | |
// { name: 'Kendall Drury', character: 'DM', episodes: 15 }, | |
// { name: 'Thomas Taufan', character: 'Antrius', episodes: 14 } | |
// ] | |
// Creates a new 2d array with the selected key in position 0 and the object in position 1 of each iteration. | |
let test_uniqueObjArray_map = myObjArray.map((item) => { | |
return [item["name"], item]; | |
}); | |
// LOGS: test_uniqueObjArray_map | |
// [ | |
// ["Eva Devore", { name: "Eva Devore", character: "Evandra", episodes: 15 }], | |
// ["Alessia Medina",{ name: "Alessia Medina", character: "Nixie", episodes: 15 }], | |
// ["Kendall Drury", { name: "Kendall Drury", character: "DM", episodes: 15 }], | |
// ["Thomas Taufan", { name: "Thomas Taufan", character: "Antrius", episodes: 14 }], | |
// ["Alessia Medina",{ name: "Alessia Medina", character: "Nixie", episodes: 15 }] | |
// ]; | |
console.log("test_uniqueObjArray_map", test_uniqueObjArray_map); | |
// Creates a key-value map of a 2d array | |
let valuesObject = new Map([ | |
["key_one", "val_one"], | |
["key_two", "val_two"], | |
["key_three", "val_three"], | |
]); | |
console.log("valuesObject", valuesObject); | |
// LOGS: valuesObject Map { | |
// 'key_one' => 'val_one', | |
// 'key_two' => 'val_two', | |
// 'key_three' => 'val_three' | |
// } | |
// Create a new Map from our mapped data. | |
let test_uniqueObjArray_NewMap = new Map(test_uniqueObjArray_map); | |
// LOGS: test_uniqueObjArray_NewMap Map { | |
// 'Eva Devore' => { name: 'Eva Devore', character: 'Evandra', episodes: 15 }, | |
// 'Alessia Medina' => { name: 'Alessia Medina', character: 'Nixie', episodes: 15 }, | |
// 'Kendall Drury' => { name: 'Kendall Drury', character: 'DM', episodes: 15 }, | |
// 'Thomas Taufan' => { name: 'Thomas Taufan', character: 'Antrius', episodes: 14 } | |
// } | |
console.log("test_uniqueObjArray_NewMap", test_uniqueObjArray_NewMap); | |
let test_uniqueObjArray_NewMap_keys = test_uniqueObjArray_NewMap.keys(); | |
console.log("test_uniqueObjArray_NewMap_keys", test_uniqueObjArray_NewMap_keys); | |
// LOGS: test_uniqueObjArray_NewMap_keys [Map Iterator] { | |
// 'Eva Devore', | |
// 'Alessia Medina', | |
// 'Kendall Drury', | |
// 'Thomas Taufan' | |
// } | |
let test_uniqueObjArray_NewMap_values = test_uniqueObjArray_NewMap.values(); | |
console.log( | |
"test_uniqueObjArray_NewMap_values", | |
test_uniqueObjArray_NewMap_values | |
); | |
// LOGS: test_uniqueObjArray_NewMap_values [Map Iterator] { | |
// { name: 'Eva Devore', character: 'Evandra', episodes: 15 }, | |
// { name: 'Alessia Medina', character: 'Nixie', episodes: 15 }, | |
// { name: 'Kendall Drury', character: 'DM', episodes: 15 }, | |
// { name: 'Thomas Taufan', character: 'Antrius', episodes: 14 } | |
// } | |
// let test_uniqueObjArray_NewMap_values_asArray = Array.from( | |
// test_uniqueObjArray_NewMap_values | |
// ); | |
let test_uniqueObjArray_NewMap_values_asArray = [ | |
...test_uniqueObjArray_NewMap_values, | |
]; | |
// LOGS: test_uniqueObjArray_NewMap_values_asArray [ | |
// { name: 'Eva Devore', character: 'Evandra', episodes: 15 }, | |
// { name: 'Alessia Medina', character: 'Nixie', episodes: 15 }, | |
// { name: 'Kendall Drury', character: 'DM', episodes: 15 }, | |
// { name: 'Thomas Taufan', character: 'Antrius', episodes: 14 } | |
// ] | |
console.log( | |
"test_uniqueObjArray_NewMap_values_asArray", | |
test_uniqueObjArray_NewMap_values_asArray | |
); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment