Using Javascript, Learn How to Group an Array and Calculate the Total Number of Rows

Question

Using Javascript, Learn How to Group an Array and Calculate the Total Number of Rows

When working in SQL, a common practice is to use a select statement with a group by clause followed by a having count = 1 condition.

select bID from tableA groupBy bID having count(*) = 1

My goal is to achieve the same functionality in TypeScript without relying on additional plugins or libraries. Ideally, I would like to implement this using pure JavaScript. After some research and exploration on Stack Overflow, I came across the .reduce function which seems suitable for my requirements.

However, I encountered compilation errors and type conversion issues when attempting to implement it. The errors mentioned implicit types and missing callback functions, making progress difficult.

Essentially, I am aiming to take an array, group its elements by a specific value, determine the count of each group, set a property to true for groups with a count of 1, and then terminate the process.

I found the following code snippet online:

groupByArray(xs, key) {
    return xs.reduce(function (rv, x) {
        let v = key instanceof Function ? key(x) : x[key];
        let el = rv.find((r) => r && r.key === v);
        if (el) { el.values.push(x); } else { rv.push({ key: v, values: [x] }); }
        return rv;
    }, []);
}

PS. Variable names such as "xs" and "rv" are commonly used in short form in this context, which can be confusing to beginners like me. Any explanation of these variables in the code snippet above would be greatly appreciated.

PPS. To illustrate, consider the following data example:

[{bID:1,isDeleted:false},{bID:1,isDeleted:true},{bID:2,isDeleted:false},{bID:1,isDeleted:true},{bID:3,isDeleted:false},{bID:3,isDeleted:false},{bID:4,isDeleted:false}]

The expected output based on the criteria described earlier should be [{bId:1,isDeleted:false}{bID:2,isDeleted:false},{bID:4,isDeleted:false}].

Below is the code snippet that I managed to make work:

 var test = this.user2.scc.sA.reduce((a, b) => (a.Bid== b.Bid && !a.isDeleted) ? a : b);

Edit: Apologies for any confusion; I am writing in TypeScript, which is a superset of JavaScript. My initial mention of JavaScript was to emphasize avoiding dealing with prototypes in this scenario, as it is not considered best practice.

javascript typescript

Answer 1

Answer №1

Instead of combining and sifting through data later, you have the option to simply organize based on value and eliminate any duplicates that appear consecutively:

 function getUniqueValues(array, key) {
   return array
     .sort((a, b) => a[key] > b[key] ? 1 : -1)
     .filter((el, index) => 
       (index < 1 || el[key] !== array[index - 1][key]) &&
       (index >= array.length - 1 || el[key] !== array[index + 1][key])
    );
 }

This function can be implemented as follows:

 getUniqueValues([{id:1},{id:1},{id:2},{id:1},{id:3},{id:3},{id:4}], "id")

Answer 2

Instead of combining and sifting through data later, you have the option to simply organize based on value and eliminate any duplicates that appear consecutively:

 function getUniqueValues(array, key) {
   return array
     .sort((a, b) => a[key] > b[key] ? 1 : -1)
     .filter((el, index) => 
       (index < 1 || el[key] !== array[index - 1][key]) &&
       (index >= array.length - 1 || el[key] !== array[index + 1][key])
    );
 }

This function can be implemented as follows:

 getUniqueValues([{id:1},{id:1},{id:2},{id:1},{id:3},{id:3},{id:4}], "id")

Answer 3

Answer №2

To simplify the grouping function, you can first group the objects and then filter them to extract only those groups with a single object. You can achieve this by creating an array of grouped objects and filtering it based on the length of each group being equal to one. If needed, extract the objects from the array.

function customGroupBy(arr, prop) {
    return arr.reduce((acc, obj) => {
        var temp = acc.find(array => array[0][prop] === obj[prop]);
        if (temp) {
            temp.push(obj);
        } else {
            acc.push([obj])
        }
        return acc;
    }, []);
}

var elements = [{ bID: 1 }, { bID: 1 }, { bID: 2 }, { bID: 1 }, { bID: 3 }, { bID: 3 }, { bID: 4 }],
    results = customGroupBy(elements, 'bID')
        .filter(({ length }) => length === 1)
        .map(([val]) => val);
    
console.log(results);

Answer 4

To simplify the grouping function, you can first group the objects and then filter them to extract only those groups with a single object. You can achieve this by creating an array of grouped objects and filtering it based on the length of each group being equal to one. If needed, extract the objects from the array.

function customGroupBy(arr, prop) {
    return arr.reduce((acc, obj) => {
        var temp = acc.find(array => array[0][prop] === obj[prop]);
        if (temp) {
            temp.push(obj);
        } else {
            acc.push([obj])
        }
        return acc;
    }, []);
}

var elements = [{ bID: 1 }, { bID: 1 }, { bID: 2 }, { bID: 1 }, { bID: 3 }, { bID: 3 }, { bID: 4 }],
    results = customGroupBy(elements, 'bID')
        .filter(({ length }) => length === 1)
        .map(([val]) => val);
    
console.log(results);

Answer 5

Answer №3

With just one reduce function, you have the ability to achieve this task.

You can then transform it into a versatile function similar to what is demonstrated in other responses.

function groupUnique(data, key) {
    return data.reduce((accumulator, element) => {
    const targetIdx = accumulator.findIndex(el => el[key] === element[key]);
    if (targetIdx > -1) {
        return accumulator.splice(targetIdx, 1);
    }
    return accumulator.concat(element)
}, [])}

Answer 6

With just one reduce function, you have the ability to achieve this task.

You can then transform it into a versatile function similar to what is demonstrated in other responses.

function groupUnique(data, key) {
    return data.reduce((accumulator, element) => {
    const targetIdx = accumulator.findIndex(el => el[key] === element[key]);
    if (targetIdx > -1) {
        return accumulator.splice(targetIdx, 1);
    }
    return accumulator.concat(element)
}, [])}

Using Javascript, Learn How to Group an Array and Calculate the Total Number of Rows

Answer №1

Answer №2

Answer №3

Similar questions

Adding images to HTML using JavaScript below existing images

Monitor elements in real-time as they are inserted into the DOM using a Chrome Extension

Jest test encounters Firebase initialization error

Mootools failing to process Ajax request

Looking to transfer data between pages using node.js and ejs for database access?

Executing an asynchronous function within a TypeScript decorator

Transferring the output of a Javascript function to display in a different location

How to refresh the page when pausing the YouTube iframe API

What is the best way to transform HeadersInit into an Object<string,string> data type?

Having difficulty retrieving the selected value in JSPDF

Creating a dynamic trio of graphs with HTML5, CSS3, and Vanilla JavaScript

Prevent selection based on JSON information

GUI interface for interactive three.js fragment shaders

The smooth scrolling effect I had programmed suddenly came to a halt

What is the best way to update the class names of all JSX elements within a component when new props are received?

Encountering an issue with Angular routing: Cross-origin requests are restricted to specific protocol schemes, such as HTTP

What could be causing my Wikipedia opensearch AJAX request to not return successfully?

Looking to dynamically track an event in Firestore?

Tips for aligning text to the right with JavaScript

Exploring an object of arrays with jQuery