Say I have an object:

myObj = { 
  name: 'Luke',
  age: 12,
  height: '163cm',
  weight: '60kg',
  others: { one: '1', two: '2', three: '3'} // (Edited) Added one more key here :)
};

I want a copy of this object without certain keys to a new object in a way that the output is as below:

newObj = { 
      name: 'Luke',
      age: 12,
      one: '1',
      two: '2'
    };

I have seen examples of destructing but I wanted to know if it is possible with nested objects. Is something like this doable using destructuring or if not what would be the most efficient way to do this.

Say I have an object:

myObj = { 
  name: 'Luke',
  age: 12,
  height: '163cm',
  weight: '60kg',
  others: { one: '1', two: '2', three: '3'} // (Edited) Added one more key here :)
};

I want a copy of this object without certain keys to a new object in a way that the output is as below:

newObj = { 
      name: 'Luke',
      age: 12,
      one: '1',
      two: '2'
    };

I have seen examples of destructing but I wanted to know if it is possible with nested objects. Is something like this doable using destructuring or if not what would be the most efficient way to do this.

• javascript
• ecmascript-6
• destructuring

• 1 Do you need this for any level of deep or for some particular known structure, like the one you have described? – Shidersz Commented May 8, 2019 at 4:03
• As of now, the known structure should be fine. I have updated my question a bit. :) – Nibin Commented May 8, 2019 at 4:36
• Efficient in what way? – Joel Cornett Commented May 8, 2019 at 5:17

3 Answers 3

One way to achieve this with destructure-like syntax would be like this:

const myObj = { 
  name: 'Luke',
  age: 12,
  height: '163cm',
  weight: '60kg',
  others: { one: '1', two: '2', three : '3'}
};


const newObj = {
  /* Copy over values from "myObj" to equivalent keys in "newObj" */
  name : myObj.name,
  age : myObj.age,

  /* Spread keys "one" and "two" of the nested "others" object into "newObj" */
  ...({one, two} = myObj.others, {one, two})
}

console.log(newObj)

For pleteness, an iife approach is possible. It works by creating an arrow function that takes as parameters keys you want to keep. In the function body, spread nested objects as desired.

const myObj = { 
  name: 'Luke',
  age: 12,
  height: '163cm',
  weight: '60kg',
  others: { one: '1', two: '2'}
};

const newObj = (
  ({name, age, others}) => ({name, age, ...others})
)(myObj);

console.log(newObj);

For the object of unknown depth you can try using recursion.

• Create a function which takes an object and array of keys to be removed as arguments.
• Create a helper(which takes 1 object as parameter) function inside main and create empty object.
• Loop through the properties of obj using for..in.
• check if key is not present in the array of keys to be removed then
  • Check if the value is object then call the function recursively
  • If its not object then add it to the result obj.
• At last return the result object.

The code will convert the object of unknown depth to a plain object and you can also remove keys from nested objects.

const myObj = { 
  name: 'Luke',
  age: 12,
  height: '163cm',
  weight: '60kg',
  others: { one: '1', two: '2'}
};
const removed = ['height','weight','one'];

function removeKeys(obj,removed){
  const res = {};
  function helper(obj){
    for(let key in obj){
      if(!removed.includes(key)){
        if(typeof obj[key] === "object"){
          helper(obj[key]);
        }
        else res[key] = obj[key]
      }
    }
    
  }
  helper(obj)
  return res;
}

const res = removeKeys(myObj,removed);
console.log(res)