Did you say Spread them!?

Intro

Updating an object with defaults from another object can be tricky business.

It is our job as coders do make it as simple as possible.

But how?

Object.assign()

The goto method is Object.assign(). You have an object with default values and then you update the object with new values. This method does work. But it is not very clear.

Take a look at the code below.

Default object

Now you want to update it with the object below. Remember the trick is to not mutate the original. That is rarely a good idea.

Updates

Now you will make use of Object.assign() to create an updated object without mutating the original. Like this...

Object.assign()

Then you get the updated object...

Updated Object

This method works and we get our updated object without mutating the original.

But it is not very human readable. And what exactly does it mean to assign?

So what is a better way?

Introducing the Object spread operator.

Object Spread Operator

The Object Spread Operator is a real thing. It works similar to the regular array spread operator. The big difference is that the object is spread into another object.

What happens is you spread out two objects in key - value pairs. Then if there are any keys that are the same, then the last object will override the first.

You simply do it like this...

Spread them

This method of joining two objects with defaults is much easier to understand.

Did you say Spread them!?

Intro

Object.assign()

Default object

Updates

Object.assign()

Updated Object

Object Spread Operator

Spread them

Happy Coding

Did you say spread them!?