Clone array of object but with selected properties

Question

I have the following two interface defined:

interface BarProp {
    Item: Foo[];
    Date: string;
}

interface Foo {
    Name: string;
    Date: string;
    IsValid: boolean;
}

I'm trying to do two things:

Clone BarProp.Item array but only with the properties Name and Date
In this cloned array, add a new property if IsValid is true

I have implemented the following and it works. But I'm looking for a more elegant solution.

// First create a new array by mapping over `Items` with only `Name` and `Date`
const newItemsArray = BarProp.Items.map((i) => {
    return {
        Name: i.Name,
        Date: i.Date,
    };
});

//loop over this new array and conditionally add `New Property`    
for (let i = 0; i < newItemsArray.length; i++) {
    if (BarProps.Items[i].IsValid) {
        newItemsArray[i].NewProperty = "New Property";
    }
}

Thanks!

edit:

proposed change:

const newItemsArray = BarProp.Items.map((i, index) => {
    if (i.IsValid) {
        Name: i.Name,
        Date: i.Date,
        NewProperty: "NewProperty",
    } else {
        Name: i.Name,
        Date: i.Date,
    }
});

You don't need to iterate twice, you can assign the property directly in the map loop, using the index. Is props the array you need to check for? — briosheje
– briosheje, Commented May 2, 2019 at 12:32
@briosheje note that I only want NewProperty if IsValid is true. I've updated original post with a proposed change. please have a look. — blankface
– blankface, Commented May 2, 2019 at 12:37
Please provide further informations about what props.Items is. Is it a different array? is it just a typo and meant to be BarProp.Items? The proposed change logic is correct anyway, though the syntax is wrong. — briosheje
– briosheje, Commented May 2, 2019 at 12:38
Is this a school assignment? Maybe look at using lambda to iterate the collection of items to a new instance of the object type.. — Martin M
– Martin M, Commented May 2, 2019 at 12:38

briosheje · Accepted Answer · 2019-05-02 12:42:45Z

2

Not sure why you need this, it doesn't sound extremely reasonable to me, but you can make that in a single loop.

You can take advantage of Object.assign to create a new object in a single shot according to whether IsValid is true or not.

// First create a new array by mapping over `Items` with only `Name` and `Date`
const newItemsArray = BarProp.Items.map((i) => {
    return Object.assign({
        Name: i.Name,
        Date: i.Date
    }, i.IsValid ? {
        NewProperty: 'New Property'
    }: {});
});

Once again, this doesn't sound as a great design choice whatsoever, but if that's somehow, somewhere, needed, it's a possible solution. Of course, there are several other ways to accomplish that, but Object.assign is the most logical solution, in my opinion, making the code easier to maintain on the long run.

edited May 2, 2019 at 12:42

answered May 2, 2019 at 12:40

briosheje

7,4662 gold badges35 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

blankface Over a year ago

Its needed as part of a project Im working on. I've boiled it down to its essence here.

briosheje Over a year ago

@ZeroDarkThirty fine, perhaps showing the original problem would lead to other possible solutions, though. The best I can guess here is that it can be done in a single loop, not sure whether the "extended" goal would make this piece of code useless, though ;).

blankface Over a year ago

its part of a react app that uses a third party component. i need to create this newItemsArray before passing it on to this component as a prop.

blankface Over a year ago

just wondering, why do i need to do Object assign? wouldn't mapping and returning the new object be enough?

briosheje Over a year ago

@ZeroDarkThirty you don't "need" it, I've just decided to use it because it's easy to concatenate objects due to the fact that the Object.assign constructor acceps infinite objects as arguments, returning a single merged object. You can also create a single object, check whether IsValid is true, assign the new property and return the new object, but the syntax will be longer. In this way, you can do that in a single line using a ternary operator and Object.assign.

|

Collectives™ on Stack Overflow

Clone array of object but with selected properties

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related