How to set all object properties to null in JavaScript? - vue.js

Question

I am using Vue and suddenly some of the computed css using vuetify is not working.
The way I declare an object is
personal_info : {}
and in my template, I could just do personal_info.name and other more in every v-model of text input.
I have no errors but suddenly the vuetify has a class called input-group--dirty that will elevate the label of the text input whenever it's not empty. But suddenly, it's not working. It looks like this:
As you can see, the text and label are overlapping.
The only thing that make it work is to set the property to null which is:
personal_info : {
name: null
}
The problem is that I have hundreds of text inputs and I dont want to set everything to null.
Is there a simple way to set all of the object's properties to null instead of coding it 1 by 1?

Answer 1

checkout this snippet
var personal_info = {
name: 'john',
email: 'john#moto.com',
phone: [phone]
}
console.log(JSON.stringify(personal_info)); //before looping
for (var key in personal_info ) {
personal_info[key] = null;
}
console.log(JSON.stringify(personal_info));//after looping and setting value to 'null'

Answer 2

Vilas example is ok. But in case you have nested properties and your obj looks like this you could try my snippet
var obj = {
a: 1 ,
b: 2,
c: {
e:3,
b: {
d:6,
e: ['23']
}
}
};
var setProps = function(flat, newVal){
for(var i in flat){
if((typeof flat[i] === "object") && !(flat[i] instanceof Array)){
setProps(flat[i], newVal);
return;
} else {
flat[i] = newVal;
}
}
}
setProps(obj, null);
console.log(JSON.stringify(obj));

Answer 3

you can use simple immutable oneliner:
Object.fromEntries(Object.entries(YOUR_OBJECT).map(([key]) => [key, null])))
const bio = {
name: 'john',
age: 22,
hobbies: ['soccer']
}
const resetBio = Object.fromEntries(Object.entries(bio).map(([key]) => [key, null]))
console.log(bio)
console.log(resetBio)