How to use object destructuring spread operator to delete multiple object properties

Question

I am using in my reducers Map/Associative array to store object via string ID.

When I need new item into Map I am using this construction

rows: { ...state.rows, [row.id]: row }

When I need delete item form map by Id I am using this.

const  { [rowId]: deleted, ...rows } = state.rows;

Than in variable rows I have map and property with name rowId is missing.

I am wondering how can i do this if i have multiple Ids in array and I need delete all of them via ... operator and destructuring.

const contentIds = ['id1','id2','id3']

// something like ???
const {...[ids], ...rows}

Yes I can write lamda for that or use omit lodash. But just interesting if it is possible.

Thanks very much

Nina Scholz · Accepted Answer · 2019-04-18 09:58:39Z

3

You could reduce the keys with the object.

var object = { id: 1, id1: 2, id2: 3 },
    contentIds = ['id1', 'id2', 'id3'],
    result = contentIds.reduce((o, k) => ({ [k]: _, ...r } = o, r), object);

console.log(result);

edited Apr 18, 2019 at 9:58

answered Apr 18, 2019 at 9:47

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

2 Comments

Ivan Mjartan Over a year ago

Hi ... like your solution ... I know how to do it ... I was just wonder if it is possible do it via simple spread and destructuring as elegant way as deleting one id

Nina Scholz Over a year ago

the answer is, you can not spread the keys for getting an assignment. actually.

Code Maniac · Accepted Answer · 2019-04-18 11:03:32Z

I am wander how can i do this if i have multiple Ids in array and I need delete all of them via ... operator and destructuring.

No you can't do this, you're probably getting confused with rest and spread syntax, ... on the left hand side of assignment is rest syntax not spread

Rest and Spread

And rest syntax expects ... followed by variable name, what you're trying is syntaxError

const object = {a:1,b:2,c:3}
const a = ['a','b']
const {...[a], ...rows} = object

console.log(rows)

More over you can't use , tralling comma after rest so even if you do

let {...a, ...rows } = obj

it's still invalid

const object = {a:1,b:2,c:3}

const {...a, ...rows} = object

console.log(rows)

You can use the solution suggested by @nina or you can create a copy of object and loop through contentIds and delete key/value from copyObj to get desired value

const object = { id: 1, id1: 2, id2: 3 };
const contentIds = ['id1', 'id2', 'id3'];
const objCopy = object

contentIds.forEach(key=>{
  delete objCopy[key]
})

console.log(objCopy);

Khaled Osman · Accepted Answer · 2019-04-18 10:05:58Z

0

const myObj = { id1: 'test', id2: 'test', id3: 'test' }
const idsToFilter = ['id1', 'id2']
const { id1, id2, ...filtered } = myObj
console.log(filtered)

However you can't do that programmatically unless you know the exact ids you want to filter from the object however. if you want to do it based on an array of ids instead, you'd need to use something like this

function filterObjectByKeys (object, keysToFilter) {
  return Object.keys(object).reduce((accum, key) => {
    if (!keysToFilter.includes(key)) {
      return { ...accum, [key]: object[key] }
    } else {
      return accum
    }
  }, {})
}

edited Apr 18, 2019 at 10:05

answered Apr 18, 2019 at 10:00

Khaled Osman

1,51513 silver badges19 bronze badges

Collectives™ on Stack Overflow

How to use object destructuring spread operator to delete multiple object properties

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related