How can I match all the values without having the closure in a for-in loop overwrite the object?

Question

I'm trying to take the values of a flat object and copy them to the values of a nested object when the keys match.

this.flatProfile = {
    address1: "456 Grand Street"
    address2: "Apt 5i"
    city: "Brooklyn"
    email: "[email protected]"
    mobile: "2163861880"
    phone: "2163861880"
    state: "NY"
    zip: "55111"
}

this.profileData = {
    physical_address: {
        address1: "",
        address2: "",
        city: "",
        zip: "",
        state: "",
    },
    mailing_address: {
        address1: "",
        address2: "",
        city: "",
        zip: "",
        state: "",
    },
    contact: {
        email: "",
        primary_phone_number: "",
        secondary_phone_number: ""
    }
}

I'm using a for loop to check if the keys match and if they do I'm setting the value to the corresponding key in this.profileData.

 // const arr = []; 
    for(var flatProfileKey in this.flatProfile) {
        for(var key in this.profileData['physical_address']) {

            if(flatProfileKey === key) {
                // arr.push({[key]: this.flatProfile[key]})

                this.profileData['physical_address'] = {
                    [key]: this.flatProfile[key]
                }
            }
        }

        for(var key in this.profileData['mailing_address']) {
            if(flatProfileKey === key) {
                // arr.push({[key]: this.flatProfile[key]})
                this.profileData['mailing_address'] = {
                    [key]: this.flatProfile[key]
                }
            }
        }

        for(var key in this.profileData['contact']) {
            if(flatProfileKey === key) {
                // arr.push({[key]: this.flatProfile[key]})
                this.profileData['contact'] = {
                    [key]: this.flatProfile[key]
                }

                console.log('profileData', this.profileData)
            }
        }
    }

The problem I'm encountering is because the for-in loop creates a closure only the last value is matched and so this.profileData returns

this.profileData = {
    contact: {
        email: "[email protected]"
    },
    mailing_address: {
        state: "NY"
    },
    physical_address: {
        state: "NY"
    }
}

How can I match all the values without having the closure overwrite the object? I tried creating an array outside the for loops and pushing the values to it, but that didn't work. That's what the commented out arr was for. Also, I need to return a nested object because that's what I need to pass to my component.

Answer 1

Don't create a new object each time you find a match...just assign the values to existing object

Example change:

if (flatProfileKey === key) {
  this.profileData['physical_address'] = {
    [key]: this.flatProfile[key]
  }
}

To

if (flatProfileKey === key) {
  this.profileData['physical_address'][key] = this.flatProfile[key]
}