What is difference between creating object using Object.create() and Object.assign()?

javascript object-create
madox2 picture madox2 · Jan 17, 2016 · Viewed 14.5k times · Source

Considering following code:

var obj1 = Object.create({}, {myProp: {value: 1}});
var obj2 = Object.assign({}, {myProp: 1});

Is there any difference between obj1 and obj2 since each object has been created in a different way?

Answer

Oriol picture Oriol · Jan 17, 2016

Let's compare obj1 and obj2 in this code:

var target1 = {}, target2 = {};
var obj1 = Object.create(target1, {myProp: {value: 1}});
var obj2 = Object.assign(target2, {myProp: 1});

Prototypical chain

Object.create creates a new object with the specified [[Prototype]], and Object.assign assigns the properties directly on the specified object:

obj1 !== target1;
obj2 === target2;

The prototypical chains of obj1 and obj2 look like

obj1 --> target1 -->  Object.prototype --> null
obj2 -------------->  Object.prototype --> null

Properties

Object.create defines properties and Object.assign only assigns them.

When creating a property, assignments will create it as configurable, writable and enumerable. When defining a property, you can specify those flags, but by default it's not configurable, nor writable and not enumerable.

Object.getOwnPropertyDescriptor(obj1, 'myProp');
  // { value: 1, writable: false, enumerable: false, configurable: false }
Object.getOwnPropertyDescriptor(obj2, 'myProp');
  // { value: 1, writable: true, enumerable: true, configurable: true }

Related questions

Using "Object.create" instead of "new"

Javascript 1.9.3 / ECMAScript 5 introduces Object.create, which Douglas Crockford amongst others has been advocating for a long time. How do I replace new in the code below with Object.create? var UserA = function(nameParam) { this.id = MY_GLOBAL.nextId(); this.name = …

Read More
Understanding the difference between Object.create() and new SomeFunction()

I recently stumbled upon the Object.create() method in JavaScript, and am trying to deduce how it is different from creating a new instance of an object with new SomeFunction(), and when you would want to use one over the …

Read More
JavaScript inheritance: Object.create vs new

In JavaScript what is the difference between these two examples: Prerequisite: function SomeBaseClass(){ } SomeBaseClass.prototype = { doThis : function(){ }, doThat : function(){ } } Inheritance example A using Object.create: function MyClass(){ } MyClass.prototype = Object.create(SomeBaseClass.prototype); Inheritance example B using the new keyword …

Read More