1

I have two javascript Objects. I want to take a key:Object pair from the first and put it into the second.

var first  = { a:1, b:2, c:{c1:11, c2:22, c3:33} }   
var second = { d:3, e:4 }

How can I obtain a third object such as this?

{ d:3, e:4, c:{c1:11, c2:22, c3:33} }

Is this the most elegant solution?

var third = second
third.c=first.c

I would like to avoid repeating the .c, something like "take first.c and append both key and value to the second object",

This solution supposes that you have key and value separated: Appending a key value pair to a json object and this one Appending a key value pair to a javascript object adds in fact a new key which does not belong to another object.

Improve this question
2
  • "elegant" is in the eye of the beholder, and is thus not on topic. I'm not sure what's wrong with "repeating the .c", since that's the specific property you want. At some point, you're going to need to specify it, one way or another. Commented May 15, 2017 at 21:01
  • "I would like to avoid repeating the .c, something like "take first.c and append both key and value to the second object"" - Not sure why you don't want to do that.. Commented May 15, 2017 at 21:02

5 Answers 5

Reset to default
1

In fact in JavaScript there are several options to set a property to an object:

  1. Using simple . or [] notations, is the easiest and the most common way.
  2. Using Object.assign() method.
  3. Using Object.defineProperty() and Object.defineProperties() methods.

Apart from the fact that the third option defineProperty()/defineProperties() give you the hand to customize these extra properties with descriptors such as configurable, enumerable and writable or get and set accessors, all these options will do the same thing and extend the òbjectwith a newproperty`.

So basically there's no much elegant or most suitable way to use, it all depends on the situation.

In your specific case to avoid doing it in two lines:

var third = second
third.c=first.c

You can better use Object.assign() like this:

var third = Object.assign({}, second, { c: first.c });
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1

You cousl use Object.assign and use a new object as result.

var first  = { a: 1, b: 2, c: { c1: 11, c2: 22, c3: 33 } },
    second = { d: 3, e: 4 },
    third = Object.assign({}, second, { c: first.c });

console.log(third);

Improve this answer

Comments

1

If you want to copy by reference, the easiest way is to do what you did.

var third = second
third.c=first.c

But this will also make second have a 'c' property on it. For a clean object, one way would be to do

var third = Object.assign({}, first, second);
delete first.a
delete first.b

Or you could do something like this

var third = Object.assign({}, second)
third.c = Object.assign({}, first.c)
Improve this answer

Comments

1

You can use, which mutates the object

Object.assign(second, { c: first.c });

this one does not mutate the object

var third = Object.assign({}, second, { c: first.c });

or spread operator (you need to transpile it using Babel).

second = { ...second, { c: first.c });
Improve this answer

2 Comments

the first mutates second and the second does not work with objects in ES6.
You are right. I'm used to use transpiler to use the spread operator. Thanks
1

I suggest destructuring assignment for DRY code, namely the object property spread:

var third = {...second, c: first.c}; // ESNEXT

This is currently a stage 3 proposal considered for inclusion into the next JavaScript standard. For now, use Babel for backwards compatibility: Try it out.

Improve this answer

2 Comments

interesting, but it does not work in node 7.10 console
@leonardvertighel Might be in node 8 nightly: node.green/#ESNEXT-candidate--stage-3---object-rest-properties

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.