CODEWITHSUNDEEP
javascriptarraysecmascript-6javascript-objects
NellaGnute
NellaGnute

Reputation: 335

How to overwrite JavaScript object values using Object()

I am still somewhat new to JavaScript, Node, etc. and come from a Groovy background (which has extremely similar syntax to JavaScript). In Groovy, I can easily do something like this:

def myMap1 = {};
def myMap2 = {};

myMap1["key1"] = "value1";
myMap1["key2"] = "value2";
myMap1["key3"] = "value3";

myMap1.each() { key, value =>
    myMap2[key] = value;
}

This would iterate through the existing map (myMap1) and copy the values for each key to the new map (myMap2), with the same key names. Easy as pie. However, JS has a concept of the prototype, which has been driving me crazy because you have to use hasOwnProperty, the index of the item sort of thing, etc and it results in a lot of code for something that's supposed to be really simple.

Looking at the MDN docs for Object(), it looks like JS has implemented something that allows a developer to access key/value pairs without having to deal with prototyping and all of that stuff, and you can just access the data in the object, and not properties of the object. I now have this:

var existingData = {"foo":"thing","bar":"otherThing","baz":"whatever"};
var update = {"foo":"newStuff","bar":"thisChanged","baz":"arghh"};

for (const [ key, value ] of Object.entries(update)) {
    console.log("Old value is " + existingData[key]);
    existingData[key] = value;
    console.log("Setting " + existingData[key] + " to " + value);
}

I would think this would work, but I get this in the console instead:

Old value is undefined
Setting thing to thing
Old value is undefined
Setting otherThing to otherThing
Old value is undefined
Setting whatever to whatever

It looks like existingData[key] does not reference the key in the key/value pair, but instead the value or something? How do I tell it, "for this key name in this second object, set this value?" I've been searching forever on Google and everything is either doing it the old way (with indexes) or is overly complicated for no particular reason. Any help would be greatly appreciated.

Upvotes: 8

Views: 39585

Answers (4)

Matthew P
Matthew P

Reputation: 735

You could just do this - looping through an array of the keys:

let myMap1 = {};
let myMap2 = {};

myMap1["key1"] = "value1";
myMap1["key2"] = "value2";
myMap1["key3"] = "value3";

// create an array of the keys in the object myMap1
let myMap1_keys = Object.keys(myMap1);

// loop through the array of object keys
for (let i = 0; i < myMap1_keys.length; i++) {
  myMap2[myMap1_keys[i]] = myMap1[myMap1_keys[i]];
}

I would advise not using a for..in loop i.e. as used in one of the other answers as these are slower than a native for loop (as used above). You can see some details regarding performance here: Comparing JavaScript loops performance (for, do while, for in)

If you are just interested in literally duplicating the object you can do that like so:

let myMap2 = JSON.parse(JSON.stringify(myMap1));

Anouther answer suggested using Object.assign() and anouther suggested using ES6 spread operators but these will 'shallow' copy the object which means the objects are using references to the original object and will only copy the top level of the object - the method above deep copies the object which I usually find is what is required for most use cases and will copy every level of the object.

Upvotes: 2

Koushik Chatterjee
Koushik Chatterjee

Reputation: 4175

Simply use Object.assign(map2, map1) to update map2 (copy key/value of map1 to map2)

Or you can use,

map2 = {...map2, ...map1} to build a new object and replace the map2 completely

To have a deep copy, instead of only first level you can use JSON.parse(JSON.stringify(map2)) instead of map2. If you think, its a large object and that impact performance, go for a nested implementation of copy recursively! ;-)

Upvotes: 7

idmitrov
idmitrov

Reputation: 509

for (let key in map1) {
    map2[key] = map1[key];
}

BTW why you dont use Object.assign(); ? (notice: it returns a new object)

let update = { "key1": "value1", "key2": "value2" };
let map2 = Object.assign({}, map1, update);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

Upvotes: 10

user6250770
user6250770

Reputation: 690

You can iterate over keys. check is this helpful to you

var m1 = {};
let m2 = {};

m1["key1"] = "abc";
m1["key2"] = "def";
m1["key3"] = "ghi";

var m1_change_key = Object.keys(m1);

for (var i = 0; i < m1_change_key.length; i++) {
  m2[m1_change_key[i]] = m1[m1_change_key[i]];
 alert(m2[m1_change_key[i]])
}

Upvotes: 0

Related Questions