Sort through a list of objects by certain properties

Question

Sort through a list of objects by certain properties

I'm currently dealing with two arrays: one contains displayed columns and the other contains objects retrieved from a database, with more attributes than the displayed columns.

displayedColumns = ['CompanyName','Ticker', 'Id', 'Name', 'Date', 
      'Spot', 'PreviousTradeDate', 'PreviousSpot', 'FPrice', 'Status']

 data = [ {CompanyName = "..." Ticker = "..." other attributes........}
{.......} ]

I am facing issues filtering the data array to only show the attributes and values from the displayed columns array (excluding the other attributes).

I am unsure how to achieve this using the map() function, especially when I need to filter by more than one value.

Any help would be greatly appreciated. Thank you!

javascript arrays angular typescript

Answer 1

Answer №1

If you wish to create a new object with specific keys from an array, you can use the map function.

var displayedColumns = ['CompanyName','Ticker', 'Id'],
    data = [{ CompanyName: 'ABC', Ticker: '123', Id: 1, x: 'foo' }, { CompanyName: 'ABD', Ticker: '124', Id: 2, x: 'bar' }];
    result = data.map(o => Object.assign(...displayedColumns.map(k => ({ [k]: o[k] }))));
    
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

If you wish to create a new object with specific keys from an array, you can use the map function.

var displayedColumns = ['CompanyName','Ticker', 'Id'],
    data = [{ CompanyName: 'ABC', Ticker: '123', Id: 1, x: 'foo' }, { CompanyName: 'ABD', Ticker: '124', Id: 2, x: 'bar' }];
    result = data.map(o => Object.assign(...displayedColumns.map(k => ({ [k]: o[k] }))));
    
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Answer №2

To retrieve the keys for each object in the data array and verify if those keys exist in the displayedColumns or not, you can follow this example:

var displayedColumns = ['CompanyName','Ticker', 'Id', 'Name', 'Date', 
      'Spot', 'PreviousTradeDate', 'PreviousSpot', 'FPrice', 'Status'];
      
var data = [
    {
      'CompanyName': 'CompanyName1',
      'Ticker': 'Ticker1',
      'SomeRandomProperty': 'SomeRandomProperty1'
    },
    {
      'CompanyName': 'CompanyName2',
      'Ticker': 'Ticker2',
      'SomeRandomProperty': 'SomeRandomProperty2',
      'Name': 'Name1'
    },
    {
      'CompanyName': 'CompanyName3',
      'Ticker': 'Ticker3',
      'SomeRandomProperty': 'SomeRandomProperty3',
      'Name': 'Name3',
      'FPrice':'FPrice1',
      'testProperty': 'testProperty1'
    }
];
var finalObj = [];
data.forEach(function(obj){
   var keys = Object.keys(obj);
   var innerObj = {};
   keys.forEach(function(key){
     if(displayedColumns.indexOf(key) !== -1){
       innerObj[key] = obj[key];
     }
   });
   finalObj.push(innerObj);
});

console.log(finalObj);

If you want this code to be compatible with IE browser, avoid using includes() as it is not supported in IE. Also, replace arrow functions with normal functions.

Answer 4

To retrieve the keys for each object in the data array and verify if those keys exist in the displayedColumns or not, you can follow this example:

var displayedColumns = ['CompanyName','Ticker', 'Id', 'Name', 'Date', 
      'Spot', 'PreviousTradeDate', 'PreviousSpot', 'FPrice', 'Status'];
      
var data = [
    {
      'CompanyName': 'CompanyName1',
      'Ticker': 'Ticker1',
      'SomeRandomProperty': 'SomeRandomProperty1'
    },
    {
      'CompanyName': 'CompanyName2',
      'Ticker': 'Ticker2',
      'SomeRandomProperty': 'SomeRandomProperty2',
      'Name': 'Name1'
    },
    {
      'CompanyName': 'CompanyName3',
      'Ticker': 'Ticker3',
      'SomeRandomProperty': 'SomeRandomProperty3',
      'Name': 'Name3',
      'FPrice':'FPrice1',
      'testProperty': 'testProperty1'
    }
];
var finalObj = [];
data.forEach(function(obj){
   var keys = Object.keys(obj);
   var innerObj = {};
   keys.forEach(function(key){
     if(displayedColumns.indexOf(key) !== -1){
       innerObj[key] = obj[key];
     }
   });
   finalObj.push(innerObj);
});

console.log(finalObj);

If you want this code to be compatible with IE browser, avoid using includes() as it is not supported in IE. Also, replace arrow functions with normal functions.

Sort through a list of objects by certain properties

Answer №1

Answer №2

Similar questions

Tips for setting the id parameter on the asp-route-id for the modal button

Guide to implementing ion-toggle for notifications with Ionic 2 and Angular 2

Tips for generating JSON data in the correct format dynamically while continuously adding new information to the existing object

Pass PHP date to JavaScript and increase its value

Flow - secure actions to ensure type safety

How would you utilize jQuery to access the "option" array of a select control with the attribute of multiple=true by utilizing the find() method?

Developing a quiz using jQuery to load and save quiz options

The module '@angular/core' is not found in the Visual Studio Code IDE

Determine the width of invisible images using JavaScript/jQuery

Convert all page links to post requests instead

Video tag with centered image

Easily transfer files from your browser application to your Windows applications such as Outlook or printer queues using a simple drag and

Is Eslint functioning in just one Sublime Text project?

Instructions for adding a select dropdown feature in Angular 6 that includes a search filter. Additionally, tips on how to filter objects by their name property

Troubleshooting: Why is the Array in Object not populated with values when passed during Angular App instantiation?

Tips for invoking the export function in node.js using sequelize

Managing numerous HTTP requests and subscribing at the conclusion in Angular 4

Tips for dynamically hiding/showing a button depending on the focus of two different HTML inputs

Set up a personalized React component library with Material-UI integration by installing it as a private NPM package

Angular Form Required not functioning as expected