#compare objects in an array in javascript

[april]

in JavaScript, you can create an object consisting of key-value pairs with the following syntax:

const someObject = { 'foo': true, 'bar': false };

if you're familiar with any other programming languages, you might call this structure a dictionary, and think of it as it's own type compared to (for example) an array or a set.

but in JS, everything except the built-in primitives are objects:

typeof []; // => "object" typeof new Set(); // => "object" typeof document.createElement('div'); // => "object"

which leaves me with something to ponder...

what's the clearest way to communicate that I am specifically talking about an object that consists of just key-value pairs, and not another, fancier kind of object?

JS devs: what do you call it?

Just "object"

"Plain object"

"Dictionary"

"Record"

Something else (put it in the replies!)

Voting ended onMar 6, 2023

Bonus: what I think your answer says about you...

Just "object": you might think it's silly that most things in JS are objects, or at the very least, you think it's silly to acknowledge it unless it's the subject matter of the conversation. You're comfortable allowing omission of words to communicate your meaning.

"Plain object": you don't want to be misinterpreted, but you're either a stickler for using JS-specific language when talking about JS, or want to avoid your words being nitpicked by colleagues who are.

"Dictionary": you're seasoned enough another programming languages that this is just your default way refer to this data structure, regardless of the situation.

"Record": you live and breath TypeScript. There's a good chance you even prefer to specify the types of the values, i.e. "Record".

[obscurejavascript]

Computed Property Names In JavaScript

As of ES6, JavaScript now supports using computed property names directly in objects. When defining object properties with constants or variables, this can make code easier to read. To understand this, compare these 2 implementations of toObject:

function toObjectLong(key, value) { const obj = {}; obj[key] = value; return obj; } function toObject(key, value) { return { [key]: value }; } console.log(toObjectLong('hp', 100)); // { hp: 100 } console.log(toObject('hp', 100)); // { hp: 100 }

To see where this is useful, the above can be built upon. Below is a function that is given an array of array values and a list of keys. That way the property values do not have to be defined with the initial data. Which could be useful for UIs where users can give data custom property names:

function createCarsObj(cars, key1, key2) { const carObj = {}; for (let car of cars) { carObj[car[0]] = { [key1]: car[1], [key2]: car[2] }; } return carObj; } const carData = [ ['miata', 155, 2400], ['elise', 217, 2000], ['alfaromeo', 237, 2465] ]; console.log(createCarsObj(carData, 'hp', 'weight')); // { miata: { hp: 155, weight: 2400 }, // elise: { hp: 217, weight: 2000 }, // alfaromeo: { hp: 237, weight: 2465 } }

Github Location: https://github.com/Jacob-Friesen/obscurejs/blob/master/2018/computedPropertyNames.js

[obscurejavascript]

Quick Unique Value Filter in JavaScript

Filtering for unique values is a useful operation when processing lists of data that can more information than needed. Dealing with simple values like integers or strings, the process is quite obvious:

function unique(array) { const newArray = []; // A map cannot be used since there may be less items in the new array array.forEach(function(element) { let isDuplicate = false; for (let index = 0; index < newArray.length && isDuplicate === false; index += 1) { isDuplicate = element === newArray[index]; } if (isDuplicate === false) { newArray.push(element); } }); return newArray; } console.log(uniq([1, 2, 2, 3, 3, 4, 5])); // [ 1, 2, 3, 4, 5 ] console.log(uniq([5, 4, 5, 3, 2, 4, 1])); // [ 5, 4, 3, 2, 1 ] console.log(uniq(['test1', 'test1', 'test2'])); // [ 'test1', 'test2' ]

That function maintains the ordering of the original array and always uses the first unique value. Which is similar to (_.uniq from Lodash)[https://lodash.com/docs/4.17.4#uniq].

A very important note; An object key comparison cannot be used to simplify the above. Object keys are always stored as strings with anything being sent into a key being transformed into a string. Meaning objects with different references, but the same contents would be incorrectly labeled as duplicates. The Github source at the bottom of this post gives an example of this.

This basic unique will not handle more complex cases like when deep objects need to be compared on a single property, which is why it needs to be extended to support callbacks that determine uniqueness. For example, data is retrieved from a database that lists all cars and all thier versions, but only the unique car names need to be determined:

const cars = [ { name: 'miata', hp: '115' }, { name: 'miata', hp: '133' }, { name: 'elise', hp: '217' }, { name: 'miata', hp: '155' }, { name: 'elise', hp: '189' }, ]; const uniqueCars = unique(cars, function(carA, carB) { return carB !== undefined && carA.name === carB.name; }); console.log(uniqueCars); // [ { name: 'miata', hp: '115' }, // { name: 'elise', hp: '217' } ] The only part that changed in the original function was a check for if there is a callback: function unique(array, callback) { const newArray = []; const hasCallback = typeof callback === 'function'; // A map cannot be used since there may be less items in the new array array.forEach(function(element, index) { let isDuplicate = false; for (let index = 0; index < newArray.length && isDuplicate === false; index += 1) { if (hasCallback === true) { isDuplicate = callback(element, newArray[index]) === true; } else { isDuplicate = element === newArray[index]; } } if (isDuplicate === false) { newArray.push(element); } }); return newArray; }

This is similar to (_.uniqWith from Lodash)[https://lodash.com/docs/4.17.4#uniqWith]

Github Location: https://github.com/Jacob-Friesen/obscurejs/blob/master/2017/unique.js

[rocoderes]

JavaScript Problem: Compare Objects in an Array

In this part, we are going to see that how we can compare objects in an array. So we will create some arrays, and we will compare those arrays to eliminate duplicate values. And also we will compare objects which are present in these arrays, so we can get a duplicate free array. It is a little bit hard to compare objects in JavaScript if you are a learner, so we will try to understand the problem…

View On WordPress