How can I delete a key in a nested Javascript object with a dynamic number of properties and without eval?

Question

I am looking to delete a specific key from a nested Javascript object based on a list of dynamic properties. Here is an example of what I mean:

This is a sample object:

employees: [
    {
        name: "John",
        id: 1234567890,
        salary: 60000
    },
    {
        name: "Jack",
        id: 0987654321,
        salary: 55000
    }
],
location: {
    building: {
        address: "111 Main St"
    }
}

I am looking to delete the address key when I am provided an array of ['location', 'building', 'address']

When I say "dynamic" I mean that I could also be provided with an array of ['employees', 1] so I cannot rely on a set number of nested properties.

The only approach that works for me right now is to use the dreaded eval, which is not a permanent solution since the Javascript objects that I am reading are written by users.

let jsObject = ... // the object shown above
let properties = ['location', 'building', 'address']
let evalString = ''
for (let i = 0; i < properties.length; i++){
    evalString += '[\''+properties[i]+'\']'
}
eval('delete jsObject'+evalString)

What is an alternative to eval that will accomplish this same goal?

let innerMost = jsObject; for (let i = 0; i < properties.length - 1; i++) { innerMost = innerMost[properties[i]]; }; delete innerMost[properties[properties.length - 1]]; — ASDFGerte
– ASDFGerte, Commented Jul 20, 2018 at 21:26
I thought I tried that earlier, but I must not have set the loop for the right number of iterations. That works just fine, thank you for the help. — Jacob S
– Jacob S, Commented Jul 20, 2018 at 21:32
Do you want to mutate the original object or produce a new object with the property deleted? If the latter, you can transform your list of strings into a list of lenses, compose the lenses to get one lens, and use that lens to do the transformation. — user1726343
– user1726343, Commented Jul 20, 2018 at 22:09

Nina Scholz · Accepted Answer · 2018-07-20 21:52:08Z

2

You could reduce the object by the keys and save the last key for deleting the object with that key.

function deleteKey(object, keys) {
    var last = keys.pop();
    delete keys.reduce((o, k) => o[k], object)[last];
    return object;
}

var object = { employees: [{ name: "John", id: '1234567890', salary: 60000 }, { name: "Jack", id: '0987654321', salary: 55000 }], location: { building: { address: "111 Main St" } } };

console.log(deleteKey(object, ['location', 'building', 'address']));

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

answered Jul 20, 2018 at 21:52

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

Comments

Reuven Chacha · Accepted Answer · 2018-07-20 21:43:36Z

1

This method accepts an object and an array of properties, and removes the inner most property as required

function remove(obj, props) {
    delete props.slice(0, -1).reduce((init, curr) => init && init[curr], obj)[[...props].pop()];
}

answered Jul 20, 2018 at 21:43

Reuven Chacha

8898 silver badges20 bronze badges

Comments

Mark · Accepted Answer · 2018-07-20 22:06:57Z

You can break your array into everything except the last element, get a reference to that and the call delete on the object using the last element. You can use reduce to easily build the object reference. You need to be careful with arrays because you can't use delete without leaving an empty slot — delete doesn't change the length.

Here's the basic idea:

function deleteProp(obj, keys){
    let prop = keys.pop()                     // get last key
    let c =  keys.reduce((a, c) => a[c], obj) // get penultimate obj
    if (Array.isArray(c)) c.splice(prop, 1)   // if it's an array, slice
    else delete c[prop]                       // otherwise delete

}

// Delete address
let obj = {employees: [{name: "John",id: 1234567890,salary: 60000},{name: "Jack",id: 0987654321,salary: 55000}],location: {building: {address: "111 Main St"}}}

deleteProp(obj, ['location', 'building', 'address'])
console.log(obj)

//Delete employee 1
obj = {employees: [{name: "John",id: 1234567890,salary: 60000},{name: "Jack",id: 0987654321,salary: 55000}],location: {building: {address: "111 Main St"}}}

deleteProp(obj, ['employees', 1])
console.log(obj)

//Delete employee 1 id
obj = {employees: [{name: "John",id: 1234567890,salary: 60000},{name: "Jack",id: 0987654321,salary: 55000}],location: {building: {address: "111 Main St"}}}

deleteProp(obj, ['employees', 1, 'id'])
console.log(obj)

Adam H · Accepted Answer · 2018-07-20 21:40:03Z

Here is a sample that i'm sure could be trimmed down a bit but it explains each step and you should be able to see whats happening in it:

let jsObject = {
  employees: [{
      name: "John",
      id: 1234567890,
      salary: 60000
    },
    {
      name: "Jack",
      id: 0987654321,
      salary: 55000
    }
  ],
  location: {
    building: {
      address: "111 Main St"
    }
  }
};

let properties = ['location', 'building', 'address'];

// we use this to traverse the object storing the parent
let parent = null;
// run over each property in the array
for (let i = 0; i < properties.length; i++) {
  // check if this is the last property  and we have the parent object
  if (i + 1 == properties.length && parent)
    delete parent[properties[i]]; // just delete the property from the object
  else if (parent === null)
    parent = jsObject[properties[i]] // set the initial parent
  else
    parent = parent[properties[i]] // set the parent to the property in the existing object
}
// log the output
console.log(jsObject);

You are going to want to throw error handling and checks to make sure you don't end up outside the object as well.

ASDFGerte · Accepted Answer · 2018-07-20 22:00:45Z

Navigate to the object that contains the property you want to delete, then delete it:

let jsObject = {
  employees: [
    {
      name: "John",
      id: 1234567890,
      salary: 60000
    },
    {
      name: "Jack",
      id: 0987654321,
      salary: 55000
    }
  ],
  location: {
    building: {
      address: "111 Main St"
    }
  }
};

let properties = ['location', 'building', 'address'];

let innerMost = jsObject;
for (let i = 0; i < properties.length - 1; i++) {
  if (typeof innerMost !== "object" || innerMost === null) {
    innerMost = null;
    break;
  }
  innerMost = innerMost[properties[i]];
};

if (
  innerMost !== null            &&
  typeof innerMost === "object" &&
  properties.length > 0         &&
  innerMost.hasOwnProperty(properties[properties.length - 1])
) {
  delete innerMost[properties[properties.length - 1]];
  console.log(jsObject);
} else console.log("Invalid path");

Collectives™ on Stack Overflow

How can I delete a key in a nested Javascript object with a dynamic number of properties and without eval?

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related