Select specific columns from an array using Typescript

Question

Select specific columns from an array using Typescript

I have a collection of objects and I'm looking for a way to empower the user to choose which attributes they want to import into the database. Is there a method to map and generate a separate array containing only the selected properties for insertion?

For instance, let's consider the following object array:

[
    {name: 'name1', address: 'addr1', phone: '123'},
    {name: 'name2', address: 'addr1', phone: '123'},
    {name: 'name3', address: 'addr1', phone: '123'},
    {name: 'name4', address: 'addr1', phone: '123'},
]

If the user chooses name and phone, the resulting array to be inserted in the database should appear as follows:

[
        {name: 'name1', phone: '123'},
        {name: 'name2', phone: '123'},
        {name: 'name3', phone: '123'},
        {name: 'name4', phone: '123'},
    ]

Is there a way to achieve this efficiently?

javascript typescript

Answer 1

Answer №1

Utilize the map method to create a new object

const arr = [
    {name: 'name1', address: 'addr1', phone: '123'},
    {name: 'name2', address: 'addr1', phone: '123'},
    {name: 'name3', address: 'addr1', phone: '123'},
    {name: 'name4', address: 'addr1', phone: '123'},
];

const res = arr.map(({name, phone}) => ({name, phone}));
console.log(res);

If you wish to make it more flexible with an array of properties to duplicate

const arr = [
    {name: 'name1', address: 'addr1', phone: '123'},
    {name: 'name2', address: 'addr1', phone: '123'},
    {name: 'name3', address: 'addr1', phone: '123'},
    {name: 'name4', address: 'addr1', phone: '123'},
];

const copy = ['name', 'phone'];

const res = arr.map(data => copy.reduce((o, k) => (o[k] = data[k], o), {}));

console.log(res);

Answer 2

Utilize the map method to create a new object

const arr = [
    {name: 'name1', address: 'addr1', phone: '123'},
    {name: 'name2', address: 'addr1', phone: '123'},
    {name: 'name3', address: 'addr1', phone: '123'},
    {name: 'name4', address: 'addr1', phone: '123'},
];

const res = arr.map(({name, phone}) => ({name, phone}));
console.log(res);

If you wish to make it more flexible with an array of properties to duplicate

const arr = [
    {name: 'name1', address: 'addr1', phone: '123'},
    {name: 'name2', address: 'addr1', phone: '123'},
    {name: 'name3', address: 'addr1', phone: '123'},
    {name: 'name4', address: 'addr1', phone: '123'},
];

const copy = ['name', 'phone'];

const res = arr.map(data => copy.reduce((o, k) => (o[k] = data[k], o), {}));

console.log(res);

Answer 3

Answer №2

Use the array.map method to transform an array of objects.

let people = [
    {name: 'John', age: 30, city: 'New York'},
    {name: 'Alice', age: 25, city: 'Los Angeles'},
    {name: 'Bob', age: 35, city: 'Chicago'},
]

let transformedPeople = people.map((person) => {
  return {
    name: person.name,
    age: person.age
  }
});

console.log(transformedPeople)

Answer 4

Use the array.map method to transform an array of objects.

let people = [
    {name: 'John', age: 30, city: 'New York'},
    {name: 'Alice', age: 25, city: 'Los Angeles'},
    {name: 'Bob', age: 35, city: 'Chicago'},
]

let transformedPeople = people.map((person) => {
  return {
    name: person.name,
    age: person.age
  }
});

console.log(transformedPeople)

Answer 5

Answer №3

If you ever find yourself needing to work with specific column values such as ['name', 'phone'], you can utilize a handy helper function known as pick that allows you to create objects containing only a subset of properties:

function pickKeys(keys, data) {
    const result = {};
    for (const key of keys) {
        if (key in data) {
            result[key] = data[key];
        }
    }
    return result;
}

With this implementation, simply provide an array of keys along with the source object, and pickKeys will generate a new object containing only the specified keys:

const obj = { name: 'John', address: '123 Main St', phone: '555-1234' };

console.log(
    pickKeys(['name', 'phone'], obj)
);

//////////////////////////////////////////////////

function pickKeys(keys, data) { const result = {}; for (const key of keys) { if (key in data) { result[key] = data[key]; } } return result; }

To extend this functionality to an array of objects, you can combine Array.map with pickKeys like so:

const dataArr = [
    {name: 'Alice', address: '456 Elm St', phone: '555-5678'},
    {name: 'Bob', address: '789 Oak St', phone: '555-9012'}
];

console.log(
    dataArr.map((item) => pickKeys(['name', 'phone'], item))
);

//////////////////////////////////////////////////

function pickKeys(keys, data) { const result = {}; for (const key of keys) { if (key in data) { result[key] = data[key]; } } return result; }

Answer 6

If you ever find yourself needing to work with specific column values such as ['name', 'phone'], you can utilize a handy helper function known as pick that allows you to create objects containing only a subset of properties:

function pickKeys(keys, data) {
    const result = {};
    for (const key of keys) {
        if (key in data) {
            result[key] = data[key];
        }
    }
    return result;
}

With this implementation, simply provide an array of keys along with the source object, and pickKeys will generate a new object containing only the specified keys:

const obj = { name: 'John', address: '123 Main St', phone: '555-1234' };

console.log(
    pickKeys(['name', 'phone'], obj)
);

//////////////////////////////////////////////////

function pickKeys(keys, data) { const result = {}; for (const key of keys) { if (key in data) { result[key] = data[key]; } } return result; }

To extend this functionality to an array of objects, you can combine Array.map with pickKeys like so:

const dataArr = [
    {name: 'Alice', address: '456 Elm St', phone: '555-5678'},
    {name: 'Bob', address: '789 Oak St', phone: '555-9012'}
];

console.log(
    dataArr.map((item) => pickKeys(['name', 'phone'], item))
);

//////////////////////////////////////////////////

function pickKeys(keys, data) { const result = {}; for (const key of keys) { if (key in data) { result[key] = data[key]; } } return result; }

Select specific columns from an array using Typescript

Answer №1

Answer №2

Answer №3

Similar questions

Combining the power of Google Blockly with AngularJS

Unable to download tsc through the Terminal on OS X

When working on my asp.net webform, I incorporated an AgreementCheckBox along with a CustomValidator. However, I encountered an issue where the error message

The issue at hand involves Javascript, Ajax, latte, and Presenter where there seems to be a restriction on using GET requests for a file located

Is there a way to collapse child elements in a hover sidebar using Vuetify?

Please enter a numerical value into the input field in a JavaScript form

Guide to sending post variables in an AngularJS service

Sleek transitions for navigating between cells in a data table

Selecting Laravel lists by month option

php After the ajax request, the array_push function is failing to add values to the

Exploring Angular2: A Guide to Interpolating Expressions in Templates

How can I execute JavaScript code within Aptana Studio 3 IDE?

Transform the date format from Google Forms to TypeScript

Ways to create a clickable anchor tag without using any text

How can I implement the vm. syntax using ControllerAs in my application?

Utilizing VueJs @error handler for managing broken image links

Transforming Jquery into vanilla JavaScript and sending a POST request

The Element type does no feature a Typescript property

Ways to determine the total number of npm packages installed, excluding development dependencies

Tips on avoiding redirection when submitting a form