My JavaScript object value reset function is getting out of hand

Question

I have a Form class (quite a lot like this) whose form fields are dynamically set. Here's an example fieldset:

Example form object dataset

jamb_style: '',
cutouts: '',
door: {
    length: '',
    width: '',
    thickness: '',
},
lock_bore: {
    location: '',
    diameter: '',
},
hinge: {
    size: '',
    pocket_radius: '',
    backset: '',
    locations: {
        first: '',
        second: '',
        third: '',
        fourth: '',
    },
},
face_plate: {
    length: '',
    width: '',
    radius: '',
},

As you can see some fields are nested and others aren't, if everything sat on one level then resetting the form would be trivial:

Trivially reset a field in a flat form object

reset() {
    for (let field in this.originalData) {
        this[field] = '';
    }
}

However, because some of my form data are objects my reset() function looks like this:

Warning, what you are about to see may disturb you

reset() {
    let data = this.originalData;

    for (let key in data) {
        if (typeof data[key] === 'object') {
            let subData = data[key];

            for (let subKey in subData) {
                if (typeof subData[subKey] === 'object') {
                    let subDataData = data[key][subKey];

                    for (let subKeyKey in subDataData) {
                        if (typeof data[key][subKey][subKeyKey] === 'string') {
                            this[key][subKey][subKeyKey] = '';
                        }
                    }
                }

                if (typeof subData[subKey] === 'string') {
                    this[key][subKey] = '';
                }
            }
        }

        if (typeof data[key] === 'string') {
            this[key] = '';
        }
    }
}

What I'd really like is a way to clean this up by making this function recursive, so that it drills down and ensures that a property is only cleared when it is not an object.

The problem is I have no idea how to proceed.

where is this recursive function you claim is getting out of hand? You have not posted anything that is recursive, so, it's hard to help you with your alleged issue — Jaromanda X
– Jaromanda X, Commented Apr 12, 2018 at 23:53
Recursion would be if the function calls itself, that's not the case here, is it? — Kris
– Kris, Commented Apr 12, 2018 at 23:57
The reason it's getting out of hand is because it's not recursive. As you can see from the answer, a recursive version is much simpler. — Barmar
– Barmar, Commented Apr 13, 2018 at 0:45
You are right, I updated the question to make it more accurate: what I desired was recursion. — benjivm
– benjivm, Commented Apr 13, 2018 at 2:18

Tej · Accepted Answer · 2018-04-13 00:13:24Z

2

You can try doing it recursively using the following code as baseline

function resetObject(objectToReset){
 Object.keys(objectToReset).forEach(function(key){
   if(Object.keys(objectToReset[key]).length<=1){
       objectToReset[key]='';
   }else{
      resetObject(objectToReset[key]);
   }
  });
}
resetObject(object);

The above code is trying to loop through all keys of the provided object and reset it once it identifies this to be a single key value pair and calls itself if it identifies the key to contain as sub object in it.

Hope this helps to extend it to your own idea. Happy coding.

answered Apr 13, 2018 at 0:13

Tej

4142 silver badges7 bronze badges

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

Comments

Jeremy Myers · Accepted Answer · 2018-04-13 00:55:27Z

1

A novel way of resetting your object is to keep a reference to your 'clean' form and clone it.

e.g

  const formTemplate = { //Abridged for brevity
  cutouts: '',
  hinge: {
      size: '',
      pocket_radius: '',
      backset: '',
      locations: {
          first: '',
          second: '',
          third: '',
          fourth: '',
      },
  },
}

function getNewForm(form){
	return JSON.parse(JSON.stringify(form));
}

console.assert(getNewForm(formTemplate)!==formTemplate);	//Assert new form is not equal by reference
console.assert(JSON.stringify(getNewForm(formTemplate))===JSON.stringify(formTemplate)); //Assert new form is equal by value

answered Apr 13, 2018 at 0:55

Jeremy Myers

1596 bronze badges

Collectives™ on Stack Overflow

My JavaScript object value reset function is getting out of hand

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related