Object spread vs. Object.assign

Question

Let’s say I have an options variable and I want to set some default value.

What’s is the benefit / drawback of these two alternatives?

Using object spread

options = {...optionsDefault, ...options};

Or using Object.assign

options = Object.assign({}, optionsDefault, options);

This is the commit that made me wonder.

Answer 1

This isn't necessarily exhaustive.

Spread syntax

options = {...optionsDefault, ...options};

Advantages:

• If authoring code for execution in environments without native support, you may be able to just compile this syntax (as opposed to using a polyfill). (With Babel, for example.)

• Less verbose.

Disadvantages:

• When this answer was originally written, this was a proposal, not standardized. When using proposals consider what you'd do if you write code with it now and it doesn't get standardized or changes as it moves toward standardization. This has since been standardized in ES2018.

• Literal, not dynamic.

---

Object.assign()

options = Object.assign({}, optionsDefault, options);

Advantages:

• Standardized.

• Dynamic. Example:

  var sources = [{a: "A"}, {b: "B"}, {c: "C"}];
  options = Object.assign.apply(Object, [{}].concat(sources));
  // or
  options = Object.assign({}, ...sources);
  

Disadvantages:

• More verbose.
• If authoring code for execution in environments without native support you need to polyfill.

---

This is the commit that made me wonder.

That's not directly related to what you're asking. That code wasn't using Object.assign(), it was using user code (object-assign) that does the same thing. They appear to be compiling that code with Babel (and bundling it with Webpack), which is what I was talking about: the syntax you can just compile. They apparently preferred that to having to include object-assign as a dependency that would go into their build.